Javascript 如何在图表js中将未使用的数据背景添加到条形图

我有下一个JS代码

let options = {
    type: 'bar',
    data: data,
    options: {
        cornerRadius: 30,
        maintainAspectRatio: false,
        scales: {
            xAxes: [{
                barPercentage : 0.55,
                categoryPercentage: 0.42,
                gridLines: {
                    display: false,
                }
            }],
            yAxes: [{
                ticks: {
                        min: 0,
                        max: 50,
                        stepSize: 10,
                        callback: function(value, index, values) {
                            return value + "%";
                        },
                        fontColor: '#999999',
                        fontSize: 11,
                        padding: 15,
                        fontFamily: 'GothamPro'
                }
            }],
        }
    }
}


var siteCosts = document.getElementById('siteCosts').getContext('2d');
var myChart = new Chart(siteCosts, options);

它给了我下一个图像 一定是这样的

---

接下来的问题是-如何通过Chart.js将这些灰色的未使用数据添加到条形图？

因为我不知道您的数据，所以我准备了一个自定义数据。仔细看，我已经获取了第二个数据集中的所有数据95，因为第一个数据集的最高值是95。我想你可以用这种方法解决这个问题

var ctx=document.getElementById（'myChart'）.getContext（“2d”）；
ctx.canvas.width=300；
ctx.canvas.height=200；
var图表=新图表（ctx{
类型：'bar'，
数据：{
标签：[“A”、“B”、“C”、“D”、“E”]，
数据集：[{
背景颜色：“rgb（54195110）”，
边框颜色：“rgba（255，255，255，0.5）”，
边框宽度：0，
数据：[95,75,80,55,85]
}, {
背景颜色：“#948E8D”，
边框颜色：“rgba（255，255，255，0.5）”，
边框宽度：0，
数据：[95,95,95,95,95]
}],
},
选项：{
转弯半径：30，
MaintaintAspectRatio:false，
图例：{
显示：假
},
比例：{
xAxes：[{
百分比：0.55，
类别类别：0.42，
网格线：{
显示：假，
},
是的
}],
雅克斯：[{
滴答声：{
分:0,，
最高：95，
步长：10，
回调：函数（值、索引、值）{
返回值+“%”；
},
fontColor:“#999999”，
尺寸：11，
填充：15，
fontFamily:“GothamPro”
},
是的
}],
}
}
});
因为我不知道您的数据，所以我准备了一个自定义数据。仔细看，我已经获取了第二个数据集中的所有数据95，因为第一个数据集的最高值是95。我想你可以用这种方法解决这个问题


var ctx=document.getElementById（'myChart'）.getContext（“2d”）；
ctx.canvas.width=300；
ctx.canvas.height=200；
var图表=新图表（ctx{
类型：'bar'，
数据：{
标签：[“A”、“B”、“C”、“D”、“E”]，
数据集：[{
背景颜色：“rgb（54195110）”，
边框颜色：“rgba（255，255，255，0.5）”，
边框宽度：0，
数据：[95,75,80,55,85]
}, {
背景颜色：“#948E8D”，
边框颜色：“rgba（255，255，255，0.5）”，
边框宽度：0，
数据：[95,95,95,95,95]
}],
},
选项：{
转弯半径：30，
MaintaintAspectRatio:false，
图例：{
显示：假
},
比例：{
xAxes：[{
百分比：0.55，
类别类别：0.42，
网格线：{
显示：假，
},
是的
}],
雅克斯：[{
滴答声：{
分:0,，
最高：95，
步长：10，
回调：函数（值、索引、值）{
返回值+“%”；
},
fontColor:“#999999”，
尺寸：11，
填充：15，
fontFamily:“GothamPro”
},
是的
}],
}
}
});