您的位置:首页 > 其它

echarts自定义图例的点击事件

2018-03-27 16:30 337 查看

修改图例点击事件样例代码:

当第一次点击图例时,只显示点击的图例。

当还剩一个图例被取消选中后,自动全选中所有图例。

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);

}
}

});
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  echart