white91wolf
white91wolf

Reputation: 428

Highchart Min Max for y-axis per series

i have a highchart with 4 series. I also only set the min value for each y-axis to 0 cause there arent any negative values possible. now highchart is calculating the max value by itself what is nice BUT i need this for each series itself. The reason is that i have 2 series with very high values from the range up to 5000 and the other two values are relativ small from 0 to 50. The max value highcharts calculates is used for all four series - so the chart looks like this: enter image description here

As you can see you can only see the two high value series - the other two arent really visible at the bottom of the chart. When i disable the two series with the high values the chart looks nice for the other two values:
enter image description here

is there any flag i can use so highchart will calculate the max value / scale per series? Or have i really calculate it by myself - also on zoom and so on. I found this: https://github.com/highcharts/highcharts/issues/4248 But i thought thats some basic functionality with is needed very often so there has to be something..

greetings

Upvotes: 0

Views: 1115

Answers (1)

daniel_s
daniel_s

Reputation: 3732

Maybe it would be better to use logarithmic axis type? Your chart would have only one axis adjusted to much difference between the values of series points. When it comes to differences between units of measurement, always you can set the different tooltip.pointFormat definition for specific series.

Highcharts.chart('container', {

    title: {
        text: 'Logarithmic axis demo'
    },

    yAxis: {
        type: 'logarithmic',
    },

    series: [{
        data: [1, 20, 30, 22, 16, 32, 45, 24, 11, 2],
        pointStart: 1,
        tooltip: {
            pointFormat: '<b>{point.y} km/h</b>'
        }
    }, {
        data: [4500, 3450, 4242, 2348, 5216, 3212, 4564, 3128, 5256, 4512],
        pointStart: 1,
        tooltip: {
            pointFormat: '<b>{point.y} kW/h</b>'
        }
    }]
});

Live example: https://jsfiddle.net/bfnj4mp8/

API Reference:

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

https://api.highcharts.com/highcharts/series.line.tooltip.pointFormat

Upvotes: 2

Related Questions