如何更改 ng2 图表中特定标签的颜色?



我在 Angular 8 中使用 ng2-charts 制作了一个甜甜圈图。我的甜甜圈图表中有 3 个标签,"通过"、"失败"和"打开"。我想分别为这些标签设置"绿色"、"红色"和"蓝色"。我该怎么做? 我的合规性.组件.html文件

<div>
<div>
<div style="display: block">
<canvas baseChart 
[data]="doughnutChartData" 
[labels]="doughnutChartLabels" 
[chartType]="doughnutChartType"
[options]="doughnutChartOptions"
[colors]="doughnutChartColor">
</canvas>
</div>
</div>
</div>

我的合规性.component.ts 文件

export class ComplianceComponent implements OnInit {
public doughnutChartLabels: Label[] = ['Passed', 'Open', 'Fail'];
public doughnutChartData: MultiDataSet = [
[30, 20, 50]
];
public doughnutChartType: ChartType = 'doughnut';
constructor() { }
ngOnInit() {
}
public doughnutChartColor: Array<any> = [
{ // first color
'Passed'-color:green;
'Failed'-color:red;
'Open'-color:blue;
}];
public doughnutChartOptions={
responsive: true
};
}

谢谢。

必须根据以下代码片段将colors定义为interfaceColorarray

import { Color } from 'ng2-charts';
...
public doughnutChartColor: Color[] = [
{ backgroundColor: 'green' },
{ backgroundColor: 'red' },
{ backgroundColor: 'blue' }
];

相关内容

  • 没有找到相关文章

最新更新