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

Question

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

现在我正在使用这个添加：

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

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

我正在使用 data.datasets.pop(ds1); 在单击复选框时删除。

原文由 Rodrigo Mota 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

如果您使用 data.datasets.pop(ds1) 删除，您将永远无法获得所需的结果。 dataset 属性是一个数组，所以我们只关注数组而忽略 Chart.js。

第一个问题是 pop() Arrays 类型的方法不接受参数，因此提供要删除的元素是无关紧要的。 Pop() 将始终从数组中删除最后一个元素。

要从数组中删除特定元素，您需要使用 splice() 函数。

假设 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);
}

这将删除数组中从我们找到的索引开始的第 1 条记录 ds1 。

原文由 JNYRanger 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

如果您查看 ChartJS 的内部对象 chart.data.datasets ，数据集可以通过最初添加数据集时提供的 label 来区分（奇怪的是没有 ID ) :

所以这实际上只是通过 Label 从数组中过滤出一个对象并调用 chart.update(); 的问题。

 // Filter out and set back into chart.data.datasets
chart.data.datasets = chart.data.datasets.filter(function(obj) {
    return (obj.label != targetLabel);
});
// Repaint
chart.update();

原文由 gene b. 发布，翻译遵循 CC BY-SA 4.0 许可协议