Zone Gradient Fill on top of the Line chart instead of Below

[iiiml0sto1]

Hi, I'm having some trouble trying to configure highcharts the way I want to.

The first problem I would love to get solved is this one:

I would like to make the Gradient appear on the opposite side of the line of a Highstock area chart.

Looking at the example at the Highstock chart example here, the gradient fill color appears below the line.

I have tried searching around but was unable to succeed in figuring out how to achieve this effect. I tried with an

Code: Select all

inverted

property, but I don't want the chart to be inverted, just the

Code: Select all

fillColor

+ I did some fiddling with the

Code: Select all

linearGradient

attributes without any success. I've seen this achieved in other places:

I tried with the

Code: Select all

threshold: Infinity

without luck, as I am using zones. it works without the zones... here is a fiddle: https://jsfiddle.net/9x3L1uyo/

I know this is possible as I see other people do this effect with highcharts:



Can someone please help me with this?

[hubert.k]

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

Your demo is almost everything, what you need to achieve this look of the chart. All you need to change is replace the gradients for green color (replace the top and bottom opacity). Please, check the demo below.

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

Let me know if that was what you were looking for.
Regards!

[iiiml0sto1]

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

Your demo is almost everything, what you need to achieve this look of the chart. All you need to change is replace the gradients for green color (replace the top and bottom opacity). Please, check the demo below.

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

Let me know if that was what you were looking for.
Regards!

This is so utterly epicly amazingly cool, I'm so thrilled to turn on my PC to see this... I'm so so so so thrilled, thanks so much!

[hubert.k]

That's great to hear! In case of any further questions, feel free to contact us again.