我有一个使用ng2-charts模块的chart.js图表。该图在y轴上显示百分比,在x轴上显示时间。是否可以将y轴设置为显示0到100,而不是根据数据显示动态范围?
答案 0 :(得分:1)
尝试将以下内容添加到图表选项中:
scales : {
yAxes: [{
ticks: {
steps : 10,
stepValue : 10,
max : 100,
min: 0
}
}]
}
答案 1 :(得分:0)
以我的名字。component.html:
<div style="display: block">
<canvas baseChart height="100" [datasets]="lineChartData" [labels]="lineChartLabels" [options]="lineChartOptions"
[colors]="lineChartColors" [legend]="lineChartLegend" [chartType]="lineChartType"></canvas>
以我的名字。component.ts:
public lineChartOptions: any = {
scales : {
yAxes: [{
ticks: {
beginAtZero: true,
stepValue: 10,
steps: 20,
max : 50,
}
}]
}
};
答案 2 :(得分:0)
是的,您可以通过使用y轴中的tickOption来做同样的事情
public barChartOptions: ChartOptions = {
responsive: true,
showLines: false,
tooltips: {enabled: false},
animation: {duration: 2000},
scales: {
yAxes: [{
gridLines: {
display:false
},
display: false,
ticks: {
max : 100,
min: 0
}
}]
}
};
此外,steps
和stepValue
无法正常工作,我在他们的库中检查了该库,该库也未写在那里。
barChartData: ChartDataSets[] = [
{
data: [40, 30, 30],
"backgroundColor": this.bgColors
}
];
在上面,我只需要y个条形图,因此我可以像这样设置数据,对于这三个值,我使用了相同大小的barChartLabels。
barChartLabels: Label[] = ['A', 'B', 'C'];
这对我有用,我希望它也可以在您的代码中使用:)