如何更改图例的位置(默认情况下显示在图表顶部)?我使用的是ng-charts
,我试图根据documentation更改位置,但似乎没有效果。
模板包含:
<canvas baseChart
[datasets]="datasets"
[labels]="labels"
[chartType]="type"
[colors]="colors"
[legend]="legend"
[position]="position">
</canvas>
组件变量是:
labels: string[] = [ 'EMI', 'Food', 'Fuel', 'bike' ];
type: string = 'doughnut';
legend: boolean = true;
position: string = 'left';
colors: Color[] = [{}];
datasets: any[] = [{
data: [ 3350, 5450, 4100, 1000 ],
backgroundColor: [
"#FF6384",
"#36A2EB",
"#FFCE56"
],
hoverBackgroundColor: [
"#FF6384",
"#36A2EB",
"#FFCE56"
]
}];
答案 0 :(得分:13)
根据ng2-charts
的{{3}},您可以使用options
更改ng2-charts
本身未公开的任何属性。
将[options]="options"
添加到您的模板,并将options
变量添加到您的组件:
private options: any = {
legend: { position: 'left' }
}