Echarts如何添加鼠标点击事件?

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

var myChart = echarts.init(document.getElementById('chartBox'));
    var option = {...};
    myChart.setOption(option);

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

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

注:鼠标事件包括'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);
    });

Echarts如何添加鼠标点击事件?防止重复触发点击事件的更多相关文章

  1. EasyUI中combotree允许多选的时候onSelect事件会重复触发onCheck事件

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAgEAAADkCAIAAACOkmAuAAAgAElEQVR4nO2dW2wc15nnO0EQBJsdzA

  2. heightcharts点击曲线图获取返回值的问题(ios点击图表第一次无法触发点击事件解决方法)

    需求:用的heightcharts插件,点击曲线图想获得所点击点的返回值,如图 问题代码: (function chart_line(){ var data={"title":[& ...

  3. 【C#】添加鼠标管轮事件

    对FlowLayoutPanel添加鼠标滚轮事件 在mainform中添加事件 his.flowLayoutPanel1.MouseWheel += new System.Windows.Forms. ...

  4. echarts 图的点击事件(含:点击重复触发的问题及其解决方法)

    今天用echarts的时候发现一个问题 鼠标指向不同地市触发一个事件展示该地区趋势图  但是但是后台中不管我第几次鼠标指向都会触发两次指向事件 现在贴出解决办法: 问题完美解决.但是为什么会调用两次, ...

  5. Qt 为QPushButton、QLabel添加鼠标移入移出事件

    QT 为QPushButton.QLabel添加鼠标移入移出事件**要实现的效果:**鼠标移入QPushButton时与移出时按钮变换字体颜色,鼠标移入QLabel时显示上面的文字,移出时不显示.** ...

  6. Unity 添加鼠标右键事件

    把此类放到 Editor下使用就OK using UnityEngine; using System.Collections; using System.Collections.Generic; us ...

  7. WinForm -- 为TextBox文本框添加鼠标右键菜单

    WinForm -- 为TextBox文本框添加鼠标右键菜单 1. 新建一个WinForm项目,放置一个TextBox控件 2. 从工具箱拖进来一个ContextMenuStrip 3. 将TextB ...

  8. OpenGl读取导入3D模型并且添加鼠标移动旋转显示

    原文作者:aircraft 原文链接:https://www.cnblogs.com/DOMLX/p/11543828.html 最近实习要用到opengl库就是跟opencv 有点像的那个,然后下了 ...

  9. OpenGl 导入读取多个3D模型 并且添加鼠标控制移动旋转

    原文作者:aircraft 原文链接:https://www.cnblogs.com/DOMLX/p/11627508.html 前言: 因为接下来的项目需求是要读取多个3D模型,并且移动拼接,那么我 ...

随机推荐

  1. LeetCode_101. Symmetric Tree

    101. Symmetric Tree Easy Given a binary tree, check whether it is a mirror of itself (ie, symmetric ...

  2. sqlserver如何创建链接服务器

    遇到下列问题: 线上服务器A,中转服务器B,本地服务器C 数据在A上面,想在B上面操作类似 select * from [A].[database].table这样的SQL,不用去链接服务器,直接把处 ...

  3. Struts 2 --ONGL介绍

    先了解一下OGNL的概念 OGNL的全名称Object Graph Navigation Language.全称为对象图导航语言,是一种表达式语言.使用这种表达式语言,你可以通过某种表达式语法,存取J ...

  4. robot:生成随机的8为纯数字

    1.引进random库 2.注意最后面的random为需要引入的包

  5. Netty学习笔记(一)——nio基础

    Netty简单认识: 1) Netty 是由JBOSS 提供的一个Java 开源框架. 2) Netty 是一个异步的.基于事件驱动的网络应用框架,用以快速开发高性能.高可靠性的网络I0 程序. 3) ...

  6. fastadmin 后台view data-source关联报500错误问题

    data-source 关联模型通过id关联被关联表的name字段,没有name字段就报500

  7. [转帖]可能是东半球最好的 Curl 学习指南,强烈建议收藏!

    可能是东半球最好的 Curl 学习指南,强烈建议收藏! http://www.itpub.net/2019/09/30/3302/ 记得转帖过.. 简介 curl 是常用的命令行工具,用来请求 Web ...

  8. sql server 2008 数据库管理系统使用SQL语句创建登录用户步骤详解

    介绍了sql server 2008 数据库管理系统使用SQL语句创建登录用户步骤详解 --服务器角色: --固定服务器角色具有一组固定的权限,并且适用于整个服务器范围. 它们专门用于管理 SQL S ...

  9. 数据结构 -- 哈希表(hash table)

    简介   哈希表(Hash table,也叫散列表),是根据关键码值(Key value)而直接进行访问的数据结构.也就是说,它通过把关键码值映射到表中一个位置来访问记录,以加快查找的速度.这个映射函 ...

  10. PAT甲级 树 相关题_C++题解

    树 目录 <算法笔记>重点摘要 1004 Counting Leaves (30) 1053 Path of Equal Weight (30) 1079 Total Sales of S ...