wormwood
Posts: 12
Joined: Sat Feb 12, 2022 11:11 pm

yAxis.linkedTo missing extremes

Hello, I'm trying to plot multiple series on multiple axis. I've been able to do this and alignThresholds wonderfully, but for certain data sets I'd like to set the extremes to match one another. Unfortunately, this doesn't seem to be working for non-master axis linking.

Here you can see that the axis are linked and the extremes are correct but the labels have gone missing from one axis:
https://jsfiddle.net/5haetxj0/

Here you can see that the axis are linked and the labels are correct but the extremes clip data: https://jsfiddle.net/5haetxj0/1/

In the worst case 1 series has a negative extreme and the other has a positive extreme and neither linking will work.

Is there a way to get extremes for both axes to link such that their min is the Math.min(axis1.min, axis2.min) and their max is Math.max(axis1.max, axis2.max)?
jakub.j
Posts: 1091
Joined: Tue Jan 24, 2023 11:14 am

Re: yAxis.linkedTo missing extremes

We appreciate you reaching out to us!

You can also set the extremes using axis.setExtremes method. I checked max and min value of all yAxis on chart.events.load and set extremes with that values for all yAxis. Then you don't need to link the axis.

Demo: https://jsfiddle.net/BlackLabel/kz4wfp7c/

Let me know if you have any further questions!
Best regards
Jakub
wormwood
Posts: 12
Joined: Sat Feb 12, 2022 11:11 pm

Re: yAxis.linkedTo missing extremes

Thanks for getting back so quickly. I see how that works in the example but filling it out a bit into our real usage it seems to fall over. However, I can't tell if that's a vue issue or a highcharts issue.

Here is an example more closely related to our real use case. As you can see the data is chosen programmatically and only some axis should have their min/max coupled: http://jsfiddle.net/23mtp5sL/

This means that the setExtremes will need to be called on each render (if different from existing values to break infinite loops), but for some reason the chartOptions are not updated in the chart when the render callback occurs. You can see this in the example. The log is different from the value displayed in the page.
jakub.j
Posts: 1091
Joined: Tue Jan 24, 2023 11:14 am

Re: yAxis.linkedTo missing extremes

Hey, you're welcome.

Everything works as expected you just made a tiny mistake by looping over chart.options.yAxis in line 59 instead of looping through chart.yAxis. Then from yAxis.options you can get your property and that should solve your problem. I prepared a demo to show you how this works.

Demo: http://jsfiddle.net/BlackLabel/6jgn8mq4/

Let me know if that was what you were looking for!
Best regards
Jakub
wormwood
Posts: 12
Joined: Sat Feb 12, 2022 11:11 pm

Re: yAxis.linkedTo missing extremes

:oops:

You're the best! Thanks.
jakub.j
Posts: 1091
Joined: Tue Jan 24, 2023 11:14 am

Re: yAxis.linkedTo missing extremes

I'm glad I could help you!
In case of any further questions, feel free to contact us again.

Best regards
Jakub
wormwood
Posts: 12
Joined: Sat Feb 12, 2022 11:11 pm

Re: yAxis.linkedTo missing extremes

How can we reflow the extremes based on the data when the axis are de-coupled? What I mean is, once we've setExtremes() the extremes persist even after the new series are applied (i.e. going back to seriesA in our fiddle). This is easily observed by placing a negative value anywhere in seriesA and toggling back and forth between data sets.
jakub.j
Posts: 1091
Joined: Tue Jan 24, 2023 11:14 am

Re: yAxis.linkedTo missing extremes

Hey,

I managed to achieve the solution you wanted.
I save the default extremes for the different axis and then in the render event set those extremes back when there is no coupled axis on the chart.

Demo: http://jsfiddle.net/BlackLabel/nqmb8wj9/

I hope you will find it useful
Best regards
Jakub

Return to “Highcharts Usage”