Chart.js - 定义自定义 y 轴比例

Question

I am working with Chart.js on Asp.Net and I have a bar chart. My dataset has not very close numbers so I can not determine any fixed stepSize for this dataset. My dataset like that; [105000,200000,310000,0.0002]

So, y-axis range seems like that [0 - 100000 - 200000 - 300000 ...] but I want to show it like that [ 0 - 0.005 - 100000 - 200000 - 300000 ...] .

My chart options :

options = {
    scales: {
        yAxes: [{
            ticks: {
                beginAtZero: true,
                responsive: true,
                mainAspectRatio: false
            }
        }]
    }
}

I tried to add to options " suggestedMin: 0.005 " but y-axis values didn't change.

How can I define custom scale for y-axis?

Answer 1

Try to use the callback property:

options = {
    scales: {
        yAxes: [{
            ticks: {
                beginAtZero: true,
                responsive: true,
                mainAspectRatio: false,
                callback: (v) => !!~[0, 0.005, 100000, 200000, 300000].indexOf(v) ? v : '',
                min: 0,
                max: 300000,
                step: 0.005
            }
        }]
    }
}