Question

I’m trying to set up three different gradient colors — red, green, and yellow, and then assign those colors to individual data points in my series based on the value. However, when I render the chart, they all default to the whichever color I specify on the first data point in the first series.

Consider this jsFiddle: http://jsfiddle.net/2UVcD/2/

Try changing the first color in the chartData array to yellowColor or redColor, and you can see what I mean. I have colorbypoint set to true in the plotOptions — am I missing something?

Answer 1

linearGradient have to be an array, not an object.

It should be like the following.

var perShapeGradient = [0, 0, 1, 0];

demo