Javascript 每当切换一个数据的标签时，防止切换另一个数据的标签

我有一个包含两个数据的饼图，两个按钮用于在数据之间切换。除了单击一个数据中的标签（隐藏或显示标签和数据）外，其他数据的标签也会切换

例如，在下面提供的代码中，

Data 1

下，如果我单击label

Red

将其隐藏，然后单击按钮

Data 2

显示其他数据，

Apple

也被隐藏。当我点击一个标签（

Red

等）时，如何防止其他数据的标签（

Apple

等）被切换

var chartCanvas=document.getElementById（“饼图”）；
VarData1=[12,19,3,5,2,3]；
VarData2=[45,8,3,1,13,53]；
var标签1=[‘红色’、‘蓝色’、‘黄色’、‘绿色’、‘紫色’、‘橙色’]；
var标签2=[‘苹果’、‘浆果’、‘香蕉’、‘芒果’、‘葡萄’、‘橙子’]；
//chart.js初始化：
var ctx=chartCanvas.getContext（“2d”）；
var myChart=新图表（ctx{
键入：“馅饼”，
数据：{
标签：标签1，
数据集：[
{
标签：“数据1”，
数据：数据1，
标签：标签1，
背景颜色：[
"rgba(255,99,132,0.2)",，
“rgba（54162235,0.2）”，
"rgba(255,206,86,0.2)",，
“rgba（751921920.2）”，
“rgba（153102255,0.2）”，
‘rgba（255、159、64、0.2）’
],
边框颜色：[
"rgba(255,99,132,1)",，
“rgba（54162235,1）”，
"rgba(255,206,86,1)",，
"rgba(751921921)",，
"rgba(153102255,1)",，
‘rgba（255、159、64、1）’
],
}
],
},
选项：{
图例：{
显示：对，
位置：“底部”
},
标题：{
显示：对，
正文：“数据1”
}
}
});
//饼图按钮：
var btn1=document.getElementById（“button1”）；
var btn2=document.getElementById（“button2”）；
btn1.addEventListener（“单击”，函数（）{
myChart.data.dataset[0].label=“数据1”；
myChart.data.datasets[0]。data=data1；
myChart.data.labels=标签1；
myChart.options.title.text=“数据1”；
myChart.update（）；
});
btn2.addEventListener（“单击”，函数（）{
myChart.data.dataset[0].label=“数据2”；
myChart.data.dataset[0].data=data2；
myChart.data.labels=标签2；
myChart.options.title.text=“数据2”；
myChart.update（）；
});

数据1
数据2
我找不到直接API。但是一种方法是重置元数据上的
hidden
属性

function resetLegends() {
  myChart.getDatasetMeta(0).data.forEach(item => item.hidden = false);
}


var chartCanvas=document.getElementById（“饼图”）；
VarData1=[12,19,3,5,2,3]；
VarData2=[45,8,3,1,13,53]；
var标签1=[‘红色’、‘蓝色’、‘黄色’、‘绿色’、‘紫色’、‘橙色’]；
var标签2=[‘苹果’、‘浆果’、‘香蕉’、‘芒果’、‘葡萄’、‘橙子’]；
//chart.js初始化：
var ctx=chartCanvas.getContext（“2d”）；
var myChart=新图表（ctx{
键入：“馅饼”，
数据：{
标签：标签1，
数据集：[{
标签：“数据1”，
数据：数据1，
标签：标签1，
背景颜色：[
"rgba(255,99,132,0.2)",，
“rgba（54162235,0.2）”，
"rgba(255,206,86,0.2)",，
“rgba（751921920.2）”，
“rgba（153102255,0.2）”，
‘rgba（255、159、64、0.2）’
],
边框颜色：[
"rgba(255,99,132,1)",，
“rgba（54162235,1）”，
"rgba(255,206,86,1)",，
"rgba(751921921)",，
"rgba(153102255,1)",，
‘rgba（255、159、64、1）’
],
}],
},
选项：{
图例：{
显示：对，
位置：“底部”
},
标题：{
显示：对，
正文：“数据1”
}
}
});
//饼图按钮：
var btn1=document.getElementById（“button1”）；
var btn2=document.getElementById（“button2”）；
btn1.addEventListener（“单击”，函数（）{
myChart.data.dataset[0].label=“数据1”；
myChart.data.datasets[0]。data=data1；
myChart.data.labels=标签1；
myChart.options.title.text=“数据1”；
重置图例（）；
myChart.update（）；
});
btn2.addEventListener（“单击”，函数（）{
myChart.data.dataset[0].label=“数据2”；
myChart.data.dataset[0].data=data2；
myChart.data.labels=标签2；
myChart.options.title.text=“数据2”；
重置图例（）；
myChart.update（）；
});
函数resetLegends（）{
myChart.getDatasetMeta（0.data.forEach）（item=>item.hidden=false）；
}

数据1
数据2