CODEWITHSUNDEEP
javascriptchart.jschartjs-2.6.0
Siby Augustine
Siby Augustine

Reputation: 141

Chartjs - custom y axis range

I wanted to add custom y axis range to chartjs. Currently its picking automatically.My data range is too large so min and max doesn't work properly,most of the items are invisible in that case.

Sample Data

I wanted to add some custom y axis range some thing like this

Range Required

Please give me some suggestions.

Upvotes: 2

Views: 3431

Answers (1)

Siby Augustine
Siby Augustine

Reputation: 141

I am able to fix this issue by following configurations.

yAxes: [{
        scaleLabel: {
            display: true,
            labelString: 'LABEL',
        },
        type: 'logarithmic',
        position: 'left',
        ticks: {
             min: 0, //minimum tick
             max: 10000000, //maximum tick
             callback: function (value, index, values) {
                 return Number(value.toString());//pass tick values as a string into Number function
             }
        },
        afterBuildTicks: function (chartObj) { //Build ticks labelling as per your need
            chartObj.ticks = [0,10,100,1000,10000,100000,1000000,10000000];
        }
    }]

Upvotes: 4

Related Questions