echarts重写图例点击事件

Posted shj-com

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了echarts重写图例点击事件相关的知识,希望对你有一定的参考价值。

echarts version: 3.1.2

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

  • 当第一次点击图例时,只显示点击的图例。
  • 当还剩一个图例被取消选中后,自动全选中所有图例。
  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);

            
        

    );

以上是关于echarts重写图例点击事件的主要内容,如果未能解决你的问题,请参考以下文章

echarts图例点击事件

Echarts 图例交互事件

echarts 取消图例上的点击事件和图表上鼠标滑过点击事件

关于echarts,地图区域,怎么去掉点击事件

使用Echarts中遇到值得记录的小案例

自定义图例点击事件