在Echarts区域的任何位置精准触发事件

需求背景：点击Echarts区域跳转页面，跳转的区域不包括grid的坐标及标签，翻看了Echarts官网，实现触发事件之的on方法，但是此方法只能在鼠标点击某个图形上会触发，这样并不能实现需求。通过百度和查看github issue后多用Echarts实例的getZr()方法监听到整个画布的 click 事件。

​ 使用echartsInstance.getZr().on('click' , params => {})监听画布，配合echartsInstance.containPixel('grid', pointInPixel) 方法判断点击位置是否在坐标系里面，从而解决需求问题。

​ 但是getZr()官方文档并没解释。所以下面将分享两个点击事件的场景，一：点击某个图形触发点击事件，二：点击任意位置触发点击事件并且知道自己点击的位置,处理折线不易点击的情况。

一. 场景一 : 点击图形触发点击事件

1.echartsInstance.on()

​ 鼠标点击某个图形上会触发点击事件使用on方法

​ 图形为折线上的折点，柱状图的柱子等等。折线，坐标轴的标签，坐标轴内的空白位置是不会触发点击事件。

​

​ 可选参数有：

​ 参数一：事件名称 eventName

eventName: string,//事件名称，全小写，例如'click'，'mousemove', 'legendselected'

​ 参数二：过滤条件 query

query: string|Object,//可选的过滤条件，能够只在指定的组件或者元素上进行响应。可为 string 或者 Object。

如果为 string 表示组件类型。格式可以是 'mainType' 或者 'mainType.subType'。例如：

  chart.on('click', 'series', function () {...});
  chart.on('click