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

Сегодня я снова обратился к этой проблеме и быстро нашел решение.

Доступ к скрытому свойству можно сделать, как в этом сообщении: Скажите, если линия скрыта

Это обновленный код:

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