echarts重写图例点击事件
echarts version: 3.1.2
修改图例点击事件样例代码:
- 当第一次点击图例时,只显示点击的图例。
- 当还剩一个图例被
取消选中
后,自动全选中所有图例。
var triggerAction = function(action, selected) {
legend = []; for ( name in selected) {
if (selected.hasOwnProperty(name)) {
legend.push({name: name});
}
} myChart.dispatchAction({
type: action,
batch: legend
});
}; var isFirstUnSelect = function(selected) { var unSelectedCount = 0;
for ( name in selected) {
if (!selected.hasOwnProperty(name)) {
continue;
} if (selected[name] == false) {
++unSelectedCount;
}
}
return unSelectedCount==1;
}; var isAllUnSelected = function(selected) {
var selectedCount = 0;
for ( name in selected) {
if (!selected.hasOwnProperty(name)) {
continue;
} // 所有 selected Object 里面 true 代表 selected, false 代表 unselected
if (selected[name] == true) {
++selectedCount;
}
}
return selectedCount==0;
}; myChart.on('legendselectchanged', function(obj) {
var selected = obj.selected;
var legend = obj.name; // 使用 legendToggleSelect Action 会重新触发 legendselectchanged Event,导致本函数重复运行
// 使得 无 selected 对象
if (selected != undefined) { if (isFirstUnSelect(selected)) {
triggerAction('legendToggleSelect', selected);
} else if (isAllUnSelected(selected)) {
triggerAction('legendSelect', selected); }
} });
echarts重写图例点击事件的更多相关文章
- echarts雷达图点击事件
最近看见别人问的问题,点击雷达图的拐点,获取点击数据的问题,直接上代码. echarts配置问题:https://www.douban.com/note/509404582/ <!doctype ...
- echarts雷达图点击事件 包含(2.x,3.85,4.02)测试
最近看见别人问的问题,点击雷达图的拐点,获取点击数据的问题,直接上代码. echarts 2x 的点击事件 echarts配置问题:https://www.douban.com/note/509404 ...
- echarts的地图点击事件
1.echarts的地图展示,有时候展示出的数据,虽然鼠标点击上去某个省份或者某个地方会有数据显示,但是点击一下地图没有任何动态效果,如何添加地图点击效果呢,这里自己也是坐下笔记,方便以后使用. 参考 ...
- echarts 图的点击事件(含:点击重复触发的问题及其解决方法)
今天用echarts的时候发现一个问题 鼠标指向不同地市触发一个事件展示该地区趋势图 但是但是后台中不管我第几次鼠标指向都会触发两次指向事件 现在贴出解决办法: 问题完美解决.但是为什么会调用两次, ...
- ECharts柱状图添加点击事件
参考: https://zhuanlan.zhihu.com/p/33050579 https://blog.csdn.net/sophia_xiaoma/article/details/780559 ...
- Echarts柱状图的点击事件
最近在做一些图表统计的功能,用到了百度的开源图表软件Echatrs,不得不提的是:不但上手简单而且扩展功能也是十分强大.在使用的过程中也遇到了不少问题,可能由于有关Echatrs的资料并不是很齐全,所 ...
- 给ECharts添加右键点击事件,实现右键功能菜单
由于项目的需要,使用ECharts 的力导向图来实现 整个EDW数据架构的血缘分析,由于ECharts并没有给组件定义有右键的事件,同时ECharts是开源的项目,所以研究了下源码,将ECharts2 ...
- 解决echarts中的点击事件点击后走多次接口
使用echarts图点击图之后,走了很多次接口,后来发现添加一个off事件就可以解决了,具体如下:
- Echarts折线图点击事件
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
随机推荐
- Qt编写自定义控件42-开关按钮
一.前言 从2010年进入互联网+智能手机时代以来,各种各样的APP大行其道,手机上面的APP有很多流行的元素,开关按钮个人非常喜欢,手机QQ.360卫士.金山毒霸等,都有很多开关控制一些操作,在Qt ...
- LeetCode_26. Remove Duplicates from Sorted Array
26. Remove Duplicates from Sorted Array Easy Given a sorted array nums, remove the duplicates in-pla ...
- vue-cli 引入stylus报错
在App.vue页面添加以下代码报错: <style lang="stylus" rel="stylesheet/stylus"> </sty ...
- Win10使用mysqldump导出csv文件及期间遇到的问题
作为测试,我们这里使用了名为testdb的数据库中的名为test_table的表,首先我们使用如下SQL来查看其中有何数据: select * from testdb.test_table 数据如下: ...
- ELK之elasticsearch插件导致filebeat没有上传日志至elasticsearch解决办法
使用filebeat收集nginx发现日志为上传,elasticsearch没有日志,kibana没有展示 查看filebeat日志 日志目录为/var/log/filebeat 下面有多个日志文件 ...
- Flutter FutureBuilder异步请求列表示例
Flutter的FutureBuilder列表示例 import 'package:flutter/material.dart'; import '../service/service_method. ...
- 【VS开发】【数据库开发】libevent windows下基于VS2010的编译
libevent是一个常用的网络库,下面就看看在windows下面编译测试的过程吧. 一 环境 系统:win8.1编译器:VS2013官方下载地址:http://libevent.org/版本:2.0 ...
- opencv入门笔记
一.图片基本操作 1.1 显示图片 #include <opencv2/opencv.hpp> //头文件 using namespace cv; //包含cv命名空间 void main ...
- vue-cli开发-搭建项目(一)
前言 vue-cli是Vue官方提供的命令行工具,可用于快速搭建大型单页应用.集成了webpack环境及主要依赖,对于项目的搭建.打包.维护管理等都非常方便快捷.建议先熟悉 Vue 本身之后再研究 C ...
- [转帖]Nginx为什么高效?一文搞明白Nginx核心原理
Nginx为什么高效?一文搞明白Nginx核心原理 咔咔侃技术 2019-09-06 15:37:00 https://www.toutiao.com/a6733057587622707724/ Ng ...