Starting value based on lowest value in set in stacked column chart

MartinSeverin
Posts: 2
Joined: Fri Sep 15, 2023 2:16 pm

Starting value based on lowest value in set in stacked column chart

First of all: I'm new to Highcharts and have been going through the available documentation in an attempt to figure out the solution to the issue I'm facing.

The issue is that I've recently started working on an existing Highcharts where a stacked column chart is not behaving as we would expect it to behave.

The lowest value in my data set is around 5000 and the highest value in my data set is around 40000. When we consider that this is a stacked column chart it would be reasonable to look at the columns in comparison to each other. If a column represents 10000 and another column represents 30000 you might expect to see the lower column as one third of the higher column. However I'm experiencing that the Y axis starts on the lowest value in the data set which is 5000, so I only see half of the column representing 10000 which makes for a confusing chart when looking at columns in relation to each other.

So my question is kind of broad: How does Highcharts determine the starting point of the Y axis, and how does my data set affect how it's determined?

jakub.j
Posts: 887
Joined: Tue Jan 24, 2023 11:14 am

Re: Starting value based on lowest value in set in stacked column chart

Welcome to our forum and thanks for contacting us with your question!

To have the yAxis starting from 0, simply set yAxis.min to 0. Now the column with the value 10K has the height of 53px and 30K is 160px, which is 1/3 the height.

Demo: https://jsfiddle.net/BlackLabel/2vdk3q6L/

Let me know if that was what you were looking for!
Best regards
Jakub
Jakub
Highcharts Developer

MartinSeverin
Posts: 2
Joined: Fri Sep 15, 2023 2:16 pm

Re: Starting value based on lowest value in set in stacked column chart

Thanks for the welcome Jakub!

It turns out that an incorrect yAxis.min parameter wasn't the problem after all. While testing out your suggestion I stumbled upon a redraw function in which yAxis.min was being set to yAxis.dataMin and this of course resulted in yAxis.min always being precisely that: the minimum value in the data set.

I now know what to fix!