【问题标题】:echarts 4.3.0 datazoom event not detectedecharts 4.3.0 未检测到数据缩放事件
【发布时间】:2019-09-30 14:51:18
【问题描述】:

在启用漫游的系列类型图表的图表中,我无法检测到 datazoom 事件。这适用于 eCharts 4.3.0,但我将测试以前的版本,看看它是否是回归。

传入的选项:

setup.options = {
  title: {
    top: 'bottom',
    left: 'right'
  },
  animation: false,
  tooltip: {
    trigger: 'item',
    position: 'right',
    confine: true,
    backgroundColor: 'transparent',
    padding: [40, 0, 0, 0],
    enterable: false,
    formatter: function(item) {
      return 'Click for more';
    }
  },
  series : [
    {
      name: '###',
      type: 'graph',
      layout: 'force',
      force: {
        repulsion: 95,
        gravity: 0.015,
        edgeLength: 40,
        layoutAnimation: false
      },
      roam: true,
      draggable: true,
      data: setup.nodes,
      links: setup.links,
      focusNodeAdjacency: true,
      itemStyle: {
        normal: {
          borderColor: '#fff',
          borderWidth: 1,
          shadowBlur: 10,
          shadowColor: 'rgba(0, 0, 0, 0.3)'
        }
      },
      lineStyle: {
        color: 'source',
        curveness: 0.3
      },
      emphasis: {
        lineStyle: {
          width: 10
        }
      }
    }
  ]
};



我都试过了:

// Zoom event listener
(viz.chart).on('datazoom', function(e) {
  console.log('zoomed');
  console.log(e);
});

和:

// Zoom event listener
(viz.chart).on('dataZoom', function(e) {
  console.log('zoomed');
  console.log(e);
});

我还测试了添加数据缩放工具箱组件,也没有检测到缩放事件。

【问题讨论】:

    标签: javascript zooming echarts


    【解决方案1】:

    显然图形系列类型不支持dataZoomAs an alternative,你可以为graphRoam附加一个监听器。

    myChart.on('graphRoam', function(e) {
            console.log('zoom');
    });
    

    这不会提供有关开始和结束缩放状态的信息,但它会告诉您是否发生了缩放,以及缩放是放大还是缩小。

    【讨论】:

      猜你喜欢
      • 2022-07-13
      • 1970-01-01
      • 1970-01-01
      • 2021-04-28
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2021-02-23
      • 2013-03-22
      相关资源
      最近更新 更多