如何使用angular从chartjs中的yax中移除奇数

Question

条形图

html文件

<div class="mychart" >
<canvas width="3" height="1"
*ngIf="loaded"
baseChart
[data]="barChartData"
[labels]="barChartLabels"
[options]="barChartOptions"
[legend]="barChartLegend"
[chartType]="barChartType"
[colors]="chartColors"
>
</canvas>
</div>

.ts

barChartOptions: ChartOptions = {

responsive: true,
legend: {
display: false,
},
scales: {
yAxes: [
{
gridLines:{
lineWidth:0
},
ticks: {
callback: function (value: number, index, values) {
return '$ ' + Intl.NumberFormat().format(value / 100000) + 'K';
},

},

},
],
xAxes: [{

gridLines: {
lineWidth: 0,


},

},

],

},
};

如何使用anuglar 12删除chartjs中的奇数值。我使用的是chartjs2.9.4版本和ngcharts2.4.2版本。我附上了图片供参考。我不知道使用哪个属性来删除Yaxes中的步长值。

如果缩小图表的大小，图表会变得模糊

Answer 1

您可以检查ticks回调中的值是否为偶数，如果是，则返回您所拥有的值，否则返回一个空字符串：

barChartOptions: ChartOptions = {
responsive: true,
legend: {
display: false,
},
scales: {
yAxes: [{
gridLines: {
lineWidth: 0
},
ticks: {
callback: function(value: number, index, values) {
return value % 2 === 0 ? '$ ' + Intl.NumberFormat().format(value / 100000) + 'K' : '';
},
},
}, ],
xAxes: [{
gridLines: {
lineWidth: 0,
},
},
],
},
};