Chart.js如何从label中移除不需要的datapoint数据点信息？

我尝试从图例中移除不需要的数据集展示，效果示例如下：

目前遇到tooltip的label回调函数被调用两次的问题，无法实现需求。我原本预期回调会返回数组，可以直接删除不需要的项。我不需要删除dataset里的实际数据点，仅希望始终移除tooltip中最顶部的那一条数据点展示。

HTML代码 #

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.2.1/chart.min.js"></script>
<canvas id="elm-chart" width="640" height="480"></canvas>

JS代码 #

var labels = [];
for (let index = 0; index < 12; index++) {
    labels.push(index);
}

window.onload = function () {
    var canvas = document.getElementById('elm-chart'),
        ctx = canvas.getContext('2d');

    var myLineChart = new Chart(ctx, {
        type: 'line',
        data: {
            labels: labels,
            datasets: [
                {
                    label: '-15',
                    data: [
                        {
                            x: 0,
                            y: 10,
                        },
                        {
                            x: 1,
                            y: 20,
                        },
                    ],
                    borderColor: 'red',
                },
                {
                    label: '15',
                    data: [
                        {
                            x: 1,
                            y: 20,
                        },
                        {
                            x: 2,
                            y: 30,
                        },
                    ],
                    borderColor: 'blue',
                },
                {
                    label: '25',
                    data: [
                        {
                            x: 2,
                            y: 30,
                        },
                        {
                            x: 3,
                            y: 35,
                        },
                    ],
                    borderColor: 'yellow',
                },
                {
                    label: '-15',
                    data: [
                        {
                            x: 6,
                            y: -10,
                        },
                        {
                            x: 7,
                            y: -20,
                        },
                    ],
                    borderColor: 'red',
                },
                {
                    label: '15',
                    data: [
                        {
                            x: 7,
                            y: -20,
                        },
                        {
                            x: 8,
                            y: -30,
                        },
                    ],
                    borderColor: 'blue',
                },
                {
                    label: '25',
                    data: [
                        {
                            x: 8,
                            y: -30,
                        },
                        {
                            x: 9,
                            y: -35,
                        },
                    ],
                    borderColor: 'yellow',
                },
            ],
        },
        options: {
            responsive: true,
            plugins: {
                legend: {
                    onClick: (evt, legendItem, legend) => {
                        let newVal = !legendItem.hidden;
                        legend.chart.data.datasets.forEach((dataset) => {
                            if (dataset.label === legendItem.text) {
                                dataset.hidden = newVal;
                            }
                        });
                        legend.chart.update();
                    },
                    labels: {
                        filter: (legendItem, chartData) => {
                            let entries = chartData.datasets.map((e) => e.label);
                            return entries.indexOf(legendItem.text) === legendItem.datasetIndex;
                        },
                    },
                },
                tooltip: {
                    callbacks: {
                        title: function (context) {
                            return [`test`, 'test2'];
                        },
                        label: function (context) {
                            console.log(context.dataset.label);
                            console.log(context.formattedValue);
                            console.log(context);
                            return [
                                `${context.dataset.label}:${context.formattedValue}`,
                                'test',
                            ];
                        },
                    },
                }
            },
            scales: {
                x: {
                    type: 'linear',
                    ticks: {
                        stepSize: 30,
                    },
                },
            }
        },
    });
};

1. 首先修复重复plugins配置的问题：原代码的options中先后定义了两次plugins属性，JavaScript中对象的重复键会被后定义的覆盖，导致写的legend配置完全不生效，上面的代码已经把两个plugins合并为一个，保证legend和tooltip配置同时生效。
2. 要移除tooltip最顶部的一条展示，直接在tooltip配置中新增filter回调即可，不需要修改原始dataset数据，示例配置如下：
   在plugins.tooltip下新增：

filter: function(tooltipItem, index, tooltipItems) {
    // 返回false的项不会出现在tooltip中，此处跳过第一条
    return index !== 0;
}

如果需要更灵活的过滤逻辑，也可以根据tooltipItem的dataset属性、数值等条件判断是否返回true。
3. 关于label回调被调用多次：这是Chart.js的正常逻辑，每个匹配到的hover数据点都会调用一次label回调，如果多个dataset的数据点坐标重合，就会触发多次回调，属于预期行为。

内容的提问来源于stack exchange，提问作者Marcel