我正在尝试更改 ChartJS 中最后一个单击栏的不透明度,然后在下次单击另一个栏时将其“取消突出显示”。基本上是悬停的默认行为。请注意,这是一个堆叠条形图,我希望整个条形列的不透明度发生变化,而不是每个单独的部分。
我已经能够在单击时将背景颜色(不知道如何更改不透明度)更改为黑色,但在单击下一个项目时它不会取消设置。因此,一旦点击了所有内容,整个图表就会变成黑色。
这是我目前使用的 onclick 代码:
var myChart = new Chart(ctx, {
type: 'bar',
data: data,
options: {
onClick: function(e){
myChart.update();
var element = this.getElementAtEvent(event)[0];
element.custom = element.custom || {};
element.custom.backgroundColor = '#000';
},
}
});
堆积数据:
var data = {
"labels":["2011","2012","2013","2014","2015"],
"datasets":[
{
"label":"Total Fishermen",
"backgroundColor":"#518936",
"data":[991,1020,731,850,851]
},
{
"label":"Total Processing Employees",
"backgroundColor":"#82c6d4",
"data":[0,0,130,0,0]
},
{
"label":"Total Aquaculture Employees",
"backgroundColor":"#c0136b",
"data":[0,134,130,119,0]
}
]
};
任何帮助将不胜感激!