v-charts修改点击图例事件,legendselectchanged
html:
<!--折线图-->
<ve-line :extend="item.chartExtend"
:data-zoom="dataZoom"
:height="chartHeight"
:legend="item.legend"
:data="item"
:events="chartEvents"
:settings="isRateTypeData(item.id)?successRateSettings:chartSettings"></ve-line> 需要在v-charts图表添加legend属性
chartDataColumns.map(item => {
console.log('chartDataColumns66',chartDataColumns)
if(item !== 'TIME'){
selectedObj[item] = true
}
})
chartItem['legend'] = selectedObj// 如果点击设置selected无效,则先去掉这行
this.chartEvents = {
legendselectchanged: (item) => {
let currSelectName = item.name
let currChartItem = self.chartData[self.deleteIndex]
let selectedObj = item.selected
let selectedNum = 0
for(let key in selectedObj){
if(selectedObj[key]){ // selected对象内值为true
selectedNum++
}
selectedObj[key] = false
}
if(selectedNum > 1){ // selectedNum > 1说明当前全部选中,此时点击,只有当前的设为选中
for(let key in selectedObj){
selectedObj[key] = false
}
selectedObj[currSelectName] = true
}else{ // 当前只有一个选中,点击后,全部重置为选中
for(let key in selectedObj){
selectedObj[key] = true
}
}
self.$set(currChartItem['legend'], 'selected', selectedObj)
},
legendscroll: (params) => {// 选中图例时,设置legend滚动页码,防止自动切回第一页
let legend = this.chartItemData['legend']
this.$set(legend, 'scrollDataIndex', params.scrollDataIndex)
},
}
v-charts修改点击图例事件,legendselectchanged的更多相关文章
- Echarts 自定义legend图片,修改点击之后的颜色图解
第一个问题:echarts 可以自定义图例的图标,百度上很多回答都是引用的相对路径,但是不知道为啥,我的vue项目就是引用不显示,在network里面找不到相应图片 后来我想了个法子,就是先获取到这个 ...
- QT5 QtreeWidget 实现点击item事件以及右键菜单删除item 和 重命名item
1.new 一个QTreeWidget 对象,并设置头标签,和根节点(个人程序需要) QTreeWidget* treeWidget = ui.treeWidget;//我已经在ui设计师中拖了一个Q ...
- android 防止多次点击,导致事件监听响应到其他界面
下面有个案例: A点击的时候就跳转到B界面,点击B界面后结束,返回到A界面中 1.此时在B界面中,设置点击事件,点击后结束B v.setOnClickListener(new OnClickListe ...
- 昨天所写的JQ 点击隐藏事件,关键性原理
JQ 点击隐藏事件,关键性原理 1.JQ 库的调用 一般选择为: 1)库越小越好 2)库的功能越强大越好 <script src="js/jquery.js" type=&q ...
- c#控制IE浏览器自动点击等事件WebBrowser,mshtml.IHTMLDocument2 .
// c#控制IE浏览器自动点击等事件WebBrowser,mshtml.IHTMLDocument2 分类: c# 2013-02-06 15:18 3008人阅读 评论(0) 收藏 举报 可以实现 ...
- 深入A标签点击触发事件而不跳转的详解
本文介绍下,当点击A标签时,触发事件但不跳转的实现方法,有需要的朋友参考下吧. 点击页面上的空链接,点击后页面自动刷新,并会定位到页面顶端. 不过,有时需要点击#页面但不作跳转,可以这样写: < ...
- Vue 框架-02-事件:点击, 双击事件,鼠标移上事件
Vue 框架-02-事件:点击, 双击事件,鼠标移上事件 1.单击事件:v-on:click 源码 app2.js : //实例化 vue 对象 new Vue({ //注意代码格式 //el:ele ...
- js去掉浏览器右键点击默认事件(+vue项目开启右键行为)
js去掉浏览器右键点击默认事件 1.阻止整个页面所有的右击事件 document.oncontextmenu = function(){ return false;} 2.特定的区域/元素 docum ...
- 18.Yii2.0框架模型修改记录 和 修改点击量
目录 修改数据 修改点击量 修改数据 上面要 use app\models\Article; //修改 //http://yii.com/?r=home/Edit public function ac ...
随机推荐
- 使用Docker+Jenkins自动构建部署
环境 Windows 10 Docker Version 18.06.1-ce-win73 (19507) 运行jenkins 运行jenkins 容器 docker run -d --name ln ...
- js 正则表达式,分组,非捕获或 环视的使用
定位一个字符串中,匹配与定位重复字符中的最后一个字符: 例子: <script type="text/javascript"> var str="http:/ ...
- Oracle 11g 服务启动/关闭 及 DB dump 导入
本地启动Oracle 服务脚本 由于本地机子安装了Oracle后,会自动启动一些默认的Oracle服务,这样子会导致机子比较慢.所以需要改成手动启动/关闭服务. 即用即开,不用就关. 开启的脚本: O ...
- SVN的安装与使用教程
转载:http://www.cnblogs.com/armyfai/p/3985660.html SVN简介: 为什么要使用SVN? 程序员在编写程序的过程中,每个程序员都会生成很多不同的版本,这就需 ...
- mysql5.x安装脚本
直接贴出来: #!/bin/bash #linux安装mysql服务分两种安装方法: #①源码安装,优点是安装包比较小,只有十多M,缺点是安装依赖的库多,安装编译时间长,安装步骤复杂容易出错: #②使 ...
- mysql存储引擎和索引
正确的创建合适的索引,是提升数据库查询性能的基础. 第一章 mysql之索引 索引的定义:索引是为了加速对表中数据行的检索而创建的一种分散存储的数据结构. 我们为什么要使用索引: a.极大的减少存储引 ...
- go之路
目录 go初识[第一篇]初识 go初识[第二篇]包.变量.函数
- bently addin 二次开发学习
元素结构: 一些基本元素的添加与绘制: class CreateElement { public static void LineAndLineString() { Application app = ...
- LightOJ 1372 (枚举 + 树状数组)
题目 Link 输出序列中有多少个组合 {a1,a2,a3,a4,a5,a6}可以构成一个六边形. 分析 序列每个数都不相等. 所以可以设 a1<a2<a3<a4<a5< ...
- VS code 代码高亮
因为平时经常切换笔记本.家里台式机.工作台式机用 VS code,遂发现笔记本中的 javascript 不像台式机中对象和方法语法高亮,只有简单的关键词高亮.后来找到原因系主题设置.[文件]-[首选 ...