我已经用chart.js绘制了一个甜甜圈图,现在我想参考数据更改甜甜圈图的颜色。
这是我的饼图代码
buildAlarmSummaryChart(data, label) {
this.AlarmSummaryChart = new Chart('alarmSummary', {
type: 'doughnut',
data: {
labels: label,
datasets: [{
label: 'Alarm ',
innerRadius: '82%',
data: data,
backgroundColor: [
'rgba(255,204,0,1)',
'rgba(255,153,0,1)',
'rgba(255,0,0,1)',
'rgba(0,102,0,1)'
],
borderWidth: 1
}]
},
options: {
pieceLabel: {
// tslint:disable-next-line:semicolon
render: 'value',
fontColor: '#000',
fontSize: 22,
fontStyle: 'bold',
position: 'inside',
segment: true,
arc: true
},
legend: {
labels: {
fontColor: 'black',
fontSize: 16,
},
},
cutoutPercentage: 58,
title: {
text: 'Alarm Summary',
display: true,
fontSize: 23,
fontColor: '#000'
}
}
});
}
我希望更改图表的背景颜色
如果数据具有1级,2级,则颜色应该是我设法做到的黄色和橙色,但是如果图表显示没有警报,则应该选择绿色,如果没有数据,则图表应该显示灰色。
请有人对此提供帮助