echarts折线图添加区域点击事件，而不用去点小圆点（扩大点击范围）

不要写onClick事件，用以下方法代替

myChart.getZr().on('click',function (params) {
	    var pointInPixel= [params.offsetX, params.offsetY];
	    if (myChart.containPixel('grid',pointInPixel)) {
	        /*此处添加具体执行代码*/
            
            var pointInGrid=myChart.convertFromPixel({seriesIndex:0},pointInPixel);
	        //X轴序号
	        var xIndex=pointInGrid[0];

            //获取当前图表的option
	        var op=myChart.getOption();

            //获得图表中我们想要的数据
	        var month=op.xAxis[0].data[xIndex];

	    }
	});


	//将可以响应点击事件的范围内，鼠标样式设为pointer--------------------
	myChart.getZr().on('mousemove',function (params) {
	    var pointInPixel= [params.offsetX, params.offsetY];
	    if (myChart.containPixel('grid',pointInPixel)) {
	    	myChart.getZr().setCursorStyle('pointer');
	    };
	});
	myChart.on('mouseout', function (params) {
		var pointInPixel= [params.offsetX, params.offsetY];
    	if (!myChart.containPixel('grid',pointInPixel)) {
	    	myChart.getZr().setCursorStyle('default');
	    };
    });
	//--------------------------------------------------------------

如果对convertFromPixel方法有好的理解，应该可以获得更多有效的数据，操作起来应该会更简单一点。

之前的代码IE不能识别，修改过后应该比较标准来，我测试在IE下可以正常使用。

这里暂时没有搞明白，理解肤浅，欢迎指教。

 

———————————更新————————————————————

最近才明白convertFromPixel这个破函数的作用，其实功能很弱，只是将像素坐标转换成逻辑坐标。

比如pointInPixel是[480,120]转换后得到pointInGrid[4,9]，4就是X轴坐标，5就是Y轴坐标。

finder {seriesIndex:0}其实可以换成其他很多写法，只要finder正确，结果很可能是一样的，没有具体实验过。