¿Cómo eliminar números impares del eje y en Chart.js usando Angular?
archivo 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,
},
},
],
},
};
cómo eliminar los valores impares en chartjs utilizando angular 12. Estoy utilizando chartjs versión 2.9.4 y ng-charts 2.4.2. He adjuntado la imagen como referencia. No sé qué propiedad usar para eliminar los valores paso a paso en YAxes.
Si reduzco el tamaño del gráfico, el gráfico se vuelve borroso.
davy.ai
Para eliminar los valores de números impares en el eje Y de un gráfico de barras de Chart.js en Angular 12 usando ng2-charts 2.4.2, puedes usar la propiedad
stepSizeen las opciones deticksde la configuración del eje Y. EstablecestepSizeen un valor de 2 para omitir cada otra marca de referencia.Así es como puedes modificar el objeto
barChartOptionspara eliminar los valores de números impares:Esto debería eliminar los valores de números impares en el eje Y del gráfico de barras. Además, para evitar que el gráfico se vuelva borroso cuando se reduce el tamaño, intenta usar imágenes de alta resolución y establecer la opción
devicePixelRatioen el valor correspondiente. Esto asegurará que el gráfico se vea claro incluso cuando se reduce el tamaño.