Javascript 如何从Chart.js中删除特定的数据集？

我想使用复选框从chart.js添加和删除数据集

现在，我正在使用以下内容添加：

var ds1 = {
    label: ..
    data: .. etc
};
data.datasets.push(ds1);

当我取消选中任何复选框时，它总是删除最后添加的数据集，而这不是复选框中所必需的

---

我使用的是

data.datasets.pop（ds1）

在单击复选框时删除。

如果使用

data.datasets.pop（ds1）

删除复选框，则永远不会得到所需的结果。

dataset

属性是一个数组，所以让我们只关注数组而忽略Chart.js

第一个问题是，所以提供要删除的元素是不相关的

Pop（）

将始终从数组中删除最后一个元素

要从数组中删除特定元素，需要使用函数

假设

ds1

是要删除的元素

let removalIndex = data.datasets.indexOf(ds1); //Locate index of ds1
if(removalIndex >= 0) { //make sure this element exists in the array
    data.datasets.splice(removalIndex, 1);
}

这将从我们定位的索引ds1开始删除数组中的1条记录

谢谢你JNYRanger

事情是这样的：

...
$(document).ready(function() {
$('#ind4').change(function(){
    if (this.checked) {
        graph.data.datasets.push(ds4);  
        graph.update();
    } else {
        let removalIndex = graph.data.datasets.indexOf(ds4);
        graph.data.datasets.splice(removalIndex, 1);
        graph.update();
    }
});
});

$(document).ready(function() {
$('#ind5').change(function(){
    if (this.checked) {
        graph.data.datasets.push(ds5);  
        graph.update();
    } else {
        let removalIndex = graph.data.datasets.indexOf(ds5);
        graph.data.datasets.splice(removalIndex, 1);
        graph.update();
    }
});

---

我只是在每个动作结束时添加了

graph.data….

（当graph是我图表的变量时）和

graph.update（）

。

如果查看ChartJS的内部对象

chart.data.datasets

，数据集可以通过最初添加数据集时给出的

标签来区分（奇怪的是没有
ID
）：


因此，实际上只需要通过标签从数组中过滤出一个对象，然后调用
chart.update（）；

实际上，您可以在数据集中添加一个ID：

var ds1 = {
    label: ..
    data: ..
    id : 'myId'
};
data.datasets.push(ds1);

无论如何，它都不会影响数据集或图表

然后您可以查找并删除（或更新）：

var ds1 = {
    label: ..
    data: ..
    id : 'myId'
};
data.datasets.push(ds1);

data.datasets.find((dataset, index) => {
    if (dataset.id === 'myId') {
       data.datasets.splice(index, 1);
       return true; // stop searching
    }
});
myChart.update();