stepSize is not working in chart js for line chart x-axis

I am using below option in chart :

option : {
                    scales: {
                        xAxes: [{
                            display: true,
                            scaleLabel: {
                                display: true,
                                labelString: 'fpr',
                                fontStyle: 'bold'
                            },
                            ticks: {
                                callback: function(value, index, values) {
                                    return parseFloat(value).toFixed(2);
                                },
                                autoSkip: true,
                                maxTicksLimit: 10,
                                stepSize: .2
                            }
                        }],
                        yAxes: [{
                        	
                            display: true,
                            scaleLabel: {
                                display: true,
                                labelString: 'tpr',
                                fontStyle: 'bold'
                            },
                            ticks: {
                                callback: function(value, index, values) {
                                    return parseFloat(value).toFixed(2);
                                },
                                autoSkip: true,
                                 maxTicksLimit: 10,
                                 stepSize: .2
                            }
                        }]
                    }
                }

Author: Fantashit

1 thought on “stepSize is not working in chart js for line chart x-axis

  1. Also, the step size won’t work for the bottom because the default x axis is a ‘category’ axis that doesn’t interpolate numerically.

    if you want to change that you can do

    xAxes: [{
      type: 'linear',
      display: true,
      scaleLabel: {
        display: true,
        labelString: 'fpr',
        fontStyle: 'bold'
      },
      ticks: {
        callback: function(value, index, values) {
          return parseFloat(value).toFixed(2);
        },
        autoSkip: true,
        maxTicksLimit: 10,
        stepSize: .2
      }
    }]

Comments are closed.