Changing the color of a region chart programmatically in tall charts

Question

I want to change the color of the area chart after its initial rendering.

In the JSFiddle demo, after clicking the button, you can see that the color has changed when you hover over the data point or switch the display by clicking on the legend to hide and then show again.

In both cases, the primary color of the region is not updated, but the data points and legend have.

JSFiddle Demo: http://jsfiddle.net/simonweston/tLwy5/

Any help would be greatly appreciated.

Answer 1

You can change it dynamically, but you need to manipulate the SVG DOM elements instead of the chart object:

$($('.highcharts-series').children()[0]).attr('fill','blue') 

It produces:

Answer 2

I also tried changing it with no luck, the only way is to recreate the diagram as shown here