Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

152
Views
how to remove odd number from yaxes in chartjs using angular?

bar chart

html file

 <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,
            
            
          },
          
        },
       
      ],
     
    },
  };

how to remove the odd number values in chartjs using anuglar 12 . I m using chartjs version 2.9.4 and ng-charts 2 .4.2 . I have attached the image for reference . I don't know which property to use to remove the stepvalues in Yaxes.

If reduce the size of the chart , chart became blurry

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

You can check in your ticks callback if the value is even and if so return what you have otherwise return an empty string:

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,
        },
      },
    ],
  },
};
about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!