Page 1 of 1

areasplinerange fill color that differentiates direction

Posted: Sun Dec 02, 2018 5:24 pm
by drmrbrewer
A while ago I posted the following question:

https://stackoverflow.com/questions/41292433/

I got an answer on this forum here:

viewtopic.php?f=9&t=37255&p=130830#p130841

Are there any new features added in the last couple of years that would make this any easier? It's very tricky to have to calculate crossing points of a spline... I appreciate that if I don't do it then highcharts would have to... but it would be a really neat feature to have!

Re: areasplinerange fill color that differentiates direction

Posted: Tue Dec 04, 2018 11:57 am
by rafalS
Hi, drmrbrewer!

We haven't got any feature like this built-in yet, but I can suggest you a custom, more automated solution. Unfortunately, this mathematical concept works only for straight lines, so if you want to use it, you will have to change the type of your chart from areasplinerange to arearange.

This is an example of how to find the coordinates of intersection of the lines: https://jsfiddle.net/BlackLabel/wfL968hg/

You can read about the mechanism of the main function here: https://en.wikipedia.org/wiki/Line%E2%8 ... tersection

Of course, you can additionally add a function that will loop through the whole series and look for points where your lines change to below/above automatically. I just rigidly used 6th and 7th points.

Best regards!

edit: Here you can take a look at automated calculating ;)
jsFiddle: https://jsfiddle.net/BlackLabel/0qzsm83j/

Re: areasplinerange fill color that differentiates direction

Posted: Wed Dec 05, 2018 9:56 am
by drmrbrewer
Thanks, that's really helpful. It's a shame it's not possible with spline, but I guess the calculations are even trickier!