echarts 默认显示图例_echarts图例组件点击显示功能(默认功能点击消失)
var?myChart?=?echarts.init(document.getElementById(‘main‘));
var?option?=?{
title:?{
text:?‘折線圖堆疊‘
},
tooltip:?{
trigger:?‘axis‘
},
legend:?{
data:[‘郵件營銷‘,‘聯盟廣告‘,‘視頻廣告‘,‘直接訪問‘,‘搜索引擎‘]
},
grid:?{
left:?‘3%‘,
right:?‘4%‘,
bottom:?‘3%‘,
containLabel:?true
},
toolbox:?{
feature:?{
saveAsImage:?{}
}
},
xAxis:?{
type:?‘category‘,
boundaryGap:?false,
data:?[‘周一‘,‘周二‘,‘周三‘,‘周四‘,‘周五‘,‘周六‘,‘周日‘]
},
yAxis:?{
type:?‘value‘
},
series:?[
{
name:‘郵件營銷‘,
type:‘line‘,
stack:?‘總量‘,
data:[120,?132,?101,?134,?90,?230,?210]
},
{
name:‘聯盟廣告‘,
type:‘line‘,
stack:?‘總量‘,
data:[220,?182,?191,?234,?290,?330,?310]
},
{
name:‘視頻廣告‘,
type:‘line‘,
stack:?‘總量‘,
data:[150,?232,?201,?154,?190,?330,?410]
},
{
name:‘直接訪問‘,
type:‘line‘,
stack:?‘總量‘,
data:[320,?332,?301,?334,?390,?330,?320]
},
{
name:‘搜索引擎‘,
type:‘line‘,
stack:?‘總量‘,
data:[820,?932,?901,?934,?1290,?1330,?1320]
}
]
};
myChart.setOption(option);
myChart.on(‘legendselectchanged‘,?function?(params)?{
let?option?=?this.getOption();
let?select_key?=?Object.keys(params.selected);
if?(!params.selected[params.name])?{
select_key.map(res?=>?{
option.legend[0].selected[res]?=?!params.selected[res];
});
}?else?{
select_key.map(res?=>?{
option.legend[0].selected[res]?=?false;
});
option.legend[0].selected[params.name]?=?true;
}
this.setOption(option)
});
總結
以上是生活随笔為你收集整理的echarts 默认显示图例_echarts图例组件点击显示功能(默认功能点击消失)的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： java处理最后一周_Java获取某年某
- 下一篇： h5页面禁止复制_网页禁止鼠标右键禁止全