给echart图绑定click等鼠标事件

在应用echarts的过程中，有时候需要给echarts绑定click事件

官方参考文档地址：https://echarts.apache.org/zh/api.html#echartsInstance.on

click事件

myChart.on('click',function (params) {
  console.log('params',params)
})

此时是可以实现点击效果的，但是有个不友好的地方就是，只有点击折线图节点或者柱图柱子的时候才会触发，达不到只要点击echarts就能实现点击事件的效果，多方查找文档，找到如下方法可以实现通过点击所在值的这一列就会触发的效果
代码如下：

myChart.getZr().on('click',function(params){
  let point=[params.offsetX,params.offsetY];
  if(myChart.containPixel('grid',point)){
    // convertFromPixel转换像素坐标值到逻辑坐标系上的点
    let xIndex = myChart.convertFromPixel({seriesIndex:0},
      point)[1];
    let op=myChart.getOption();
    let name=op.xAxis[0].data[xIndex];
  }
})

这部分的代码可以实现点击某一列就能触发这个事件，主要的信息集中在op这个变量中，name变量是点击某一列对应的名称，使用时可以将这个变量打印出来然后选择所需要传递的参数，其实这个代码是通过鼠标点击图形的坐标来进行判断点击的位置属于哪一列，从而实现这个需求，在这块我在写的时候碰到一个问题，有一个图形点击一次总是触发两次这个函数，如果你也出现了这个问题可以通过在绑定事件之前加上一句代码。

myChart.getZr().off('click');

mousemove事件

将地图上鼠标滑过的小手状态去掉

myChart.getZr().on('mousemove', param => {
   myChart.getZr().setCursorStyle('default')
   //  若鼠标滑过区域位置在当前图表范围内 鼠标设置为小手
   // if (radarChart.containPixel('grid', pointInPixel)) { 
   //  radarChart.getZr().setCursorStyle('pointer')
   // } 
 })