码迷,mamicode.com
首页 > 其他好文 > 详细

echarts 图的点击重复触发的问题及其解决

时间:2019-02-18 14:34:45      阅读:437      评论:0      收藏:0      [点我收藏+]

标签:cti   extends   doc   fun   rtb   执行   param   int   数据   

要求:在echart图表中,点击每个项,需要跳转对应页面或者显示对应的数据详情列表。

如何添加鼠标点击事件?

1.通常我们只使用了以下代码,通过配置项和数据显示图表。

var myChart = echarts.init(document.getElementById(‘chartBox‘));
  • myChart.setOption(option);

2.在myChart.setOption(option)后添加以下代码,即可触发图标中每个项的鼠标点击事件。

myChart.on(‘click‘,  function(param) {
  • //这个params可以获取你要的图中的当前点击的项的参数

注:鼠标事件包括‘click‘,‘dblclick‘,‘mousedown‘,‘mouseup‘,‘mouseover‘,‘mouseout‘,‘globalout‘,‘contextmenu‘。

3.如果逻辑运行中,第2点中的代码,执行了多次,则绑定之前需要清除绑定:


if(myChart._$handlers.click){    myChart._$handlers.click.length = 0;
myChart.on(‘click‘,  function(params) {
  • //这个params可以获取你要的饼图中的当前点击的项的参数

  • _this.showMapPointInfo(params,param);

转自: https://blog.csdn.net/yqwang75457/article/details/83008200

echarts 图的点击重复触发的问题及其解决

标签:cti   extends   doc   fun   rtb   执行   param   int   数据   

原文地址:https://www.cnblogs.com/choiyubo163com/p/echarts_on_click.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!