Javascript 图表JS在可见性属性切换后显示错误的数据集

在我的项目中，我在一个表中有十个图形，每个图形显示两个数据集。 我想通过单击每个数据集来切换其可见性，这是ChartJS中的默认行为

所有图表都保存在一个数组中，并遵循ChartJS的内置切换方法，将每个图表更新为第一个图表的数据集。因此，要明确的是，当页面加载时，每个图表都会正确显示，但如果我使数据集不可见并再次可见，它会变为可见，但数据错误

我尝试编写自己的更新函数来切换可见性

 var option = {

        legend: {
            onClick: ToggleDatasetVisibility,
        }}

然后

function ToggleDatasetVisibility() {

   this.chart.getDatasetMeta(1).hidden = !this.chart.getDatasetMeta(1).hidden;
    //  this.chart.update();
}

然而，同样的事情发生了。更新后,

*注意，我只切换每个DatasetMeta的第二个dataset，这就是为什么在本例中1是硬编码的。这不是问题中的图表

如果有用的话，我们将在页面加载时使用数据填充图表，在这里更新显示正确的数据

    for (var i = 0; i < 10; i++) {

        var MyArray= await fetch("http://localhost:1234/Demo/FetchResults?model_id=" + i);


        //Add the recorded tunnel data to dataset 0
        LineChartArray[i].data.datasets[0].data = ResultsArray;
        LineChartArray[i].data.datasets[0].label = '';
        LineChartArray[i].data.datasets[1].data = MyArray;
        LineChartArray[i].data.datasets[1].label = 'LabelXYZ';


        LineChartArray[i].update(); //This update updates the graph with the correct data.

    }
}

for（变量i=0；i<10；i++）{
var MyArray=等待获取（“http://localhost:1234/Demo/FetchResults?model_id=“+i）；
//将记录的隧道数据添加到数据集0
LineChartArray[i]。数据。数据集[0]。数据=结果数组；
LineChartArray[i]。数据。数据集[0]。标签=“”；
LineChartArray[i].data.datasets[1].data=MyArray；
LineChartArray[i]。数据。数据集[1]。标签='LabelXYZ'；
LineChartArray[i].update（）；//此更新使用正确的数据更新图形。
}
}

因此，我不知道chart JS是否存在错误，也不知道是否正确地确定了要更新的图表，但我发现render方法是有效的。这会在可见性切换后更新图表，并在显示时加载正确的数据。我认为这可能是我使用的“this”命令，但它与render方法配合使用效果很好

我刚刚更新了切换功能

function ToggleDatasetVisibility() {

   this.chart.getDatasetMeta(1).hidden = !this.chart.getDatasetMeta(1).hidden;
   this.chart.render();

}