echarts折线/柱状图的区域点击事件

缺陷: 柱状图数据过于悬殊时, 需要精准点击到柱状图, 体验感差
需求: 点击红色框区域都能联动

 chart.getZr().off('click') // 记得清除重复绑定事件
 // 用getZr方法绑定click
 chart.getZr().on('click', async (params) => {
     
   // 无论是否点击到图本身,都能拿到坐标
   const pointInPixel = [params.offsetX, params.offsetY]
   if (chart.containPixel('grid', pointInPixel)) {
     
     // 传入坐标到convertFromPixel方法获取到所点击的下标
     let dataIndex = chart.convertFromPixel({
      seriesIndex: 0 }, pointInPixel)[0]
     // 拿到dataIndex后处理数据 ...
   }
 })