CODEWITHSUNDEEP
javascripthighcharts
luftikus143
luftikus143

Reputation: 1285

How to set yAxis min/max in Highcharts synchronized chart with JSON

I am working with the synchronised chart of Highchart. Pretty cool. However, I would like to »dictate« the min and max values for the yAxis. I added these two parameters into the JSON file, but they are not being accepted unfortunately.

JSON file:

    "unit": "km/h",
    "type": "line",
    "min": -2,
    "max": 16,

yAxis definition:

     yAxis: {
        title: {
           text: null
        },
        min: dataset.min,
        max: dataset.max
     },

but that doesn't work. Any idea why? Here is the original graphic I am working with. Here is a fiddle.

Upvotes: 0

Views: 147

Answers (1)

ppotaczek
ppotaczek

Reputation: 39139

In Highcharts API we can read:

max: number, null

...

If the endOnTick option is true, the max value might be rounded up. (...)

As a solution disable startOnTick and endOnTick options or use tickPositioner function to calculate and set tick postion manually, for example:

            yAxis: {
                ...,
                tickPositioner: function(){
                    var ticks = [],
                    step = (dataset.max - dataset.min) / 4;

                  for (var i = dataset.min; i <= dataset.max; i += step) {
                    ticks.push(i);
                  }

                  return ticks;
                }
            }

Live demo: https://jsfiddle.net/BlackLabel/ev5hz0pk/

API Reference:

https://api.highcharts.com/highcharts/yAxis.max

https://api.highcharts.com/highcharts/yAxis.tickPositioner

Upvotes: 1

Related Questions