本文主要是介绍echarts 柱形图、折线图点击事件,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
echarts 柱形图、折线图点击事件
- 第一种
- 第二种
第一种
// echarts 万能点击事件
this.myChart.getZr().on('click', params => {let pointInPixel = [params.offsetX, params.offsetY]if (this.myChart.containPixel('grid', pointInPixel)) {//点击第几个柱子let pointInGrid = this.myChart.convertFromPixel({ seriesIndex: 0 }, pointInPixel)// 也可以通过params.offsetY 来判断鼠标点击的位置是否是图表展示区里面的位置// 也可以通过name[xIndex] != undefined,name是x轴的坐标名称来判断是否还是点击的图表里面的内容// x轴数据的索引let xIndex = pointInGrid[0]let xstr = xdata[xIndex];console.log(xstr);}
})
第二种
chartObj.on('click', (params) => { //漏斗点击事件console.log('params===', params);console.log('params.data===', params.data);console.log('params.name===', params.data.name);alert('当前点击的是:' + params.data.name);})
这篇关于echarts 柱形图、折线图点击事件的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!