Highcharts Area graph, use 2 fill colors above / below X axis

Question

In Highcharts, I'd like to fill an Area graph with 2 colors, positive values get one color, negative values get another color. I've been able to do this with a linearGradient, but this must be adjusted based upon the size of the container.

Is there a more general way of doing this, e.g. setting values > 0 color 1, values < 0 color 2?

See my JSFiddle for more information and an example: http://jsfiddle.net/GNvur/2/

Answer 1

The parameter we were looking for is named negativeColor. Use it in an area serie like this :

   series: [{
        type:'area',
        data:chartValues,
        color: "#FF0000",
        threshold: 0,
        negativeColor: '#00FFFF',
        
        marker : {
            enabled: true
        }
    }]

see the result in this JSFiddle.