使用数组索引 0 更新图表.js不起作用

Question

我有一个图表数据对象数组。我通过传递数组的索引并从对象中提取数据来更新图表数据。这完全适用于除0之外的所有索引。

初始化图表时，我加载了0索引，图表也运行良好，所以我知道这不是该特定索引的数据结构问题。使用0索引在图表上调用更新函数时，我没有收到任何错误。

下面是一个代码笔，显示它不适用于索引 0。

为什么不更新0指数的图表？

Answer 1

更改：

window.myChart = new Chart(ctx, chartData[curIndex]);

自

window.myChart = new Chart(ctx, JSON.parse(JSON.stringify(chartData[curIndex])));

原因是您需要克隆对象，否则 myChart 与 chartData[0] 相同，当您单击 1 或 2 时，它会覆盖 0。

这部分代码克隆对象 JSON.parse(JSON.stringify(chartData[curIndex]((

Answer 2

更新不起作用。 您应该重新呈现图表

function resetChart() {
const ctx = document.getElementById("myChart").getContext("2d");
window.myChart = new Chart(ctx, chartData[curIndex]);
}
window.onload = function() {
this.resetChart();
};
function UpdateChart(index) {
curIndex = index;
myChart.data.labels = chartData[curIndex].data.labels;
myChart.data.datasets[0].data = chartData[curIndex].data.datasets[0].data;
myChart.data.datasets[0].label = chartData[curIndex].data.datasets[0].label;
myChart.data.datasets[1].data = chartData[curIndex].data.datasets[1].data;
myChart.data.datasets[1].label = chartData[curIndex].data.datasets[1].label;
this.resetChart();
}