Echarts在檢測到圖例點擊時，將觸發(fā)legendselectchanged事件，提供的參數(shù)包括：

1. name，點擊的圖例名

2. seleced: {name1: value1, name2: value2, ...}，所有圖例的選中狀態(tài)
   其中name為圖例名稱，value取true | false，表示該項在點擊后處于選中狀態(tài)還是未選中狀態(tài)

通過該事件，我們可以對Echarts的圖例點擊效果作修改，規(guī)則包括：

1. （初始）全選時，點擊圖例中的某項，將只顯示該項而隱藏其他項

2. 當唯一顯示的項目被取消選中時，恢復為全選狀態(tài)

例如：點擊圖例的第三項

1. 點擊前：Yes，Yes，Yes，Yes，Yes

   • 修改前：Yes，Yes，No，Yes，Yes

   • 修改后：No，No，Yes，No，No

2. 點擊前：No，No，Yes，No，No

   • 修改前：No，No，No，No，No

   • 修改后：Yes，Yes，Yes，Yes，Yes

代碼如下

/**
 * 優(yōu)化圖例點擊事件
 * 1. （初始）全選時，點擊圖例中的某項，將只顯示該項而隱藏其他項
 * 2. 當唯一顯示的項目被取消選中時，恢復為全選狀態(tài)
 * @param {Object} theChart Echarts元素
 */
function setLegendAction(theChart) {
    let triggerAction = function (action, selected) {
        legend = [];
        for (let name in selected) {
            if (selected.hasOwnProperty(name)) {
                legend.push({name: name});
            }
        }
        theChart.dispatchAction({
            type: action,
            batch: legend
        });
    };

    let isFirstUnSelect = function (selected, legend) {
        if (selected[legend] === true) return false;
        let unSelectedCount = 0;
        for (let name in selected) {
            if (!selected.hasOwnProperty(name)) {
                continue;
            }
            if (selected[name] === false) {
                unSelectedCount++;
            }
        }
        return unSelectedCount === 1;
    };

    let isAllUnSelected = function (selected) {
        let selectedCount = 0;
        for (let name in selected) {
            if (!selected.hasOwnProperty(name)) {
                continue;
            }
            // selected對象內true代表選中，false代表未選中
            if (selected[name] === true) {
                selectedCount++;
            }
        }
        return selectedCount === 0;
    };

    theChart.on('legendselectchanged', function (params) {
        console.log(params)
        let selected = params.selected;
        let legend = params.name;
        // 使用legendToggleSelect動作將重新觸發(fā)legendselectchanged事件，導致本函數(shù)重復運行從而丟失selected對象
        if (selected !== undefined) {
            if (isFirstUnSelect(selected, legend)) {
                triggerAction('legendToggleSelect', selected);
            } else if (isAllUnSelected(selected)) {
                triggerAction('legendSelect', selected);
            }
        }
    });
}