在UI设计的时候,可能我们在使用echarts时,legend是用图片渲染的,未选中的legend是用置灰的图片展示的。即彩色图片,置灰图片交互切换。
主要代码如下:
//图例事件 let lgdt = this._ledgend(), lgData = lgdt.legendData,lgList = lgdt.legendList, imgs = this._icon(),imglg = imgs.length,unIng = this._lgiconUnActive(), iconUnActive = `image://${unIng}`; myChart.on(‘legendselectchanged‘, (params)=>{ let {selected,name} = params,i = lgList.indexOf(name); let theOption = lgData.find(dt => dt.name === name); let iconActive = `image://${imgs[i%imglg]}`; theOption.icon = selected[name] ? iconActive : iconUnActive; // 更新图列 this.$chart.setOption({ legend: { data: lgData } }) })
有问题的可以直接在评论下问我,欢迎~
echarts常用方法,legend状态支持两张图片切换(四)
原文:https://www.cnblogs.com/lmxHome/p/10769738.html