Javascript 使用Chart.js显示/隐藏条形图中的数据

我正在尝试使用

chart.js

创建一个条形图，可以在其中显示和隐藏条形图（人物）。我知道可以单击图例上的标签来执行此操作，但由于所有数据都具有相同的图例，因此所有条形图都会隐藏。如果我使用多个数据集，这些条都显示在一个条中（不知道如何正确解释）

以下是我目前拥有的一份报告：

var options = {
   type: 'horizontalBar',
   data: {
     labels: ['Person 1', 'Person 2', 'Person 3', 'Person 4'],
     datasets: [{
       label: 'Days',
       data: [20, 42, 51, 4],
       backgroundColor: ['#FFC857', '#E9724C', '#C5283D', '#481D24']
     }]
   },
   options: {
     scales: {
       xAxes: [{
         time: {
           unit: 'day'
         },
       }],

     },
     legend: {
       display: true
     },
     responsive: true
   }
 }
var ctx = document.getElementById("calendarStats").getContext('2d');
var myChart = new Chart(ctx, options);

如果有人能帮我，那就太好了：）

---

提前谢谢

我希望这会对你有所帮助

var选项={
键入：“水平线”，
数据：{
数据集：[{
标签：“人1”，
数据：[20]，
背景颜色：['#FFC857']
}, {
标签：“人2”，
数据：[42]，
背景颜色：['#E9724C']
},{
标签：“人3”，
数据：[51]，
背景颜色：['#C5283D']
},{
标签：“人4”，
数据：[4]，
背景颜色：['#481D24']
}]
},
选项：{
比例：{
xAxes：[{
时间：{
单位：'天'
},
}],
},
图例：{
显示：真
},
回答：对
}
}
var ctx=document.getElementById（“calendarStats”）.getContext（“2d”）；
var myChart=新图表（ctx，选项）

JS-Bin
您希望每个人都有单独的图例吗？是的，如果可能的话。