chart.js - 工具提示回調函數在取消選擇圖例時忽略隱藏的數據集

Question

我正在使用帶有堆疊數據集的chart.js折線圖。

將鼠標懸停在單個數據點上時，它僅顯示當前數據集的值。

我在值旁邊添加了總數（此數據集和“下面數據集”）。

這樣可以正常工作，直到我從圖例中取消選擇數據集，因為總計不會更新並忽略隱藏的數據集。

這是顯示數據集值和總數的代碼。

callbacks: {
    label: function(tooltipItem, data) {
        let total = 0;
        let value = data.datasets[tooltipItem.datasetIndex].data[tooltipItem.index];
        let stop = tooltipItem.datasetIndex+1;
        for (let i = 0; i < stop; i++) {
            total += data.datasets[i].data[tooltipItem.index];
        }
        total = Math.floor(total * 100) / 100;
        return 'Value: ' + value + ' Total: ' + total;
    }
}

你可以在這里看看這個https://jsfiddle.net/x1zycrh4/1/

當您將鼠標懸停在任意點上時，您會看到值和旁邊的總數。

但是，當您取消選擇“可用”數據集時，工具提示總計不會更新。

為此，我想忽略工具提示回調函數中隱藏的數據集，但我似乎無法訪問'data.datasets [tooltipItem.datasetIndex] .hidden'。

Answer 1

我今天重新審視了這個問題，發現解決方案非常快。

訪問'hidden'屬性可以像在這篇文章中那樣完成： 告訴我是否隱藏了一行

這是更新的代碼：

callbacks: {
    label: function(tooltipItem, data) {
        let total = 0;
        let value = data.datasets[tooltipItem.datasetIndex].data[tooltipItem.index];
        let stop = tooltipItem.datasetIndex+1;
        for (let j = 0; j < stop; j++) {
            if(!data.datasets[j]._meta[Object.keys(data.datasets[j]._meta)[0]].hidden) {
                total += data.datasets[j].data[tooltipItem.index];
            }
        }
    total = Math.floor(total * 100) / 100;
    return 'Value: ' + value + ' Total: ' + total;
    }
}