关键点: echarts 灰色区域 背景 点击;
Echarts 图形点击事件分为两种
1. 最简单的点击事件
此种方式只有点击数据才会触发事件,如果数据为空,则不会触发
myChart.on('click', function (params) {
...
});
2. 进阶点击事件
echarts 图形点击直接触发,点击柱状图后面的灰色区域也会触发,后续操作需要自己根据参数判断
myChart1.getZr().on('click', params => {
// 获取点击位置
const pointInPixel = [params.offsetX, params.offsetY];
// 是否在 grid 里面点击
if (consts.myChart1.containPixel('grid', pointInPixel)) {
// 获取 点击的图是第几个(柱状图)
let xIndex = consts.myChart1.convertFromPixel({ seriesIndex: 0 }, [params.offsetX, params.offsetY])[0];
if (!consts.datasj[xIndex]) {
return;
}
...
}
})
