1、修改legend的data值,在前面加上全选和全不选,data = ['全选','全不选',1,2,3] 2、监听 legendselectchanged事件 ...
平时做图表的时候经常用echarts,确实是一款很好用的插件。 开发中遇到了一个问题,在展示的曲线,也就是legend很多的时候,不太好只展示其中几条。配置中是可以默认设置初始化是否展示,但不适用于全选和全不选的场景。 研究了文档后发现,可以通过修改配置,然后再次调用setOption方法实现。 我的做法是添加一个button,点击按钮的时候,触发事件重新画图。代码不复杂,贴在下面。 然后点击bu ...
2017-03-16 20:19 0 7659 推荐指数:
1、修改legend的data值,在前面加上全选和全不选,data = ['全选','全不选',1,2,3] 2、监听 legendselectchanged事件 ...
...
核心代码 效果 ...
需求说明 图标涉及图例较多,为方便操作,故新增全选/全取消功能,通过全选框控制全选/全取消 实现思路 主要用到echarts > legend > selected属性以及legendselectchanged方法。当全选/全取消时通过selected属性动态赋值,改变图例 ...
当折线图时,legend默认时rect形式,如果需要改图例形状,可以自己设置legend的icon属性 1、自定义每个图例样式:为data的每个对象修改icon属性 2、修改图例的图标为自定义图片 首先我找了如下两张图片放在根目录下的images ...
legend: { icon: "circle" , // 字段控制形状 类型包括 circle,rect,line,roundRect,triangle,diamond,pin,arrow,none itemWidth: 10 ...
legend: { icon: "circle", // 字段控制形状 类型包括 circle,rect,line,roundRect,triangle,diamond,pin,arrow,none itemWidth: 10, // 设置宽度 ...
legend:{ show:true, orient:'horizontal', borderColor:'#df3434', borderWidth:2, data ...