echarts 折线图如何添加点击事件

给echarts折线图的某个点添加点击事件，并打印横纵坐标点的数据。

实现效果

效果展示

点击事件

echart添加点击事件用通过on 方法实现

myChart.on('click', function (params) {
    // 控制台打印数据的名称
    console.log(params.name);
});

制作折线图表

• 通过cdn引入

• 编写html

• 实现一个echarts

• 效果

  
  

点击事件添加

此代码添加到myChart.setOption(option);下方就实现我们想要的效果了。

myChart.on('click', function (params) {
        console.log(params)
        let data = {
          x: params.name,
          y: params.value
        }
        console.log(data)
        alert(JSON.stringify(data))
        // window.webkit.messageHandlers.iOSObj.postMessage(data)
      });

注意：此方法只有点击柱状图形和折线的圆形折点才能触发通过on添加的事件监听。