Accepted answer

try using the fillcolor property:

    name: 'xyz',
    x: 123,
    y: 456,
    fillcolor: '#00ff00'


you you would like to have colored line partially, you need to have as much series as colors. in other words, each color should be separate series with defined color.


yes you can just use plotoptions.area.zones :

see the example :

plotoptions: {
    series: {
        zoneaxis: "x",
        zones: [{
            value: 0,
            classname: 'zone-0'
        }, {
            value: 10,
            classname: 'zone-1'
        }, {
            classname: 'zone-2'
        threshold: -10

with the zoneaxis: "x" you can specify which axis you use to discriminate your differents colors.


in your data, you can specify the color of the specific points:

data: [{
    name: 'point 1',
    color: '#00ff00',
    y: 0
}, {
    name: 'point 2',
    color: '#ff00ff',
    y: 5

for line charts, use "fill color", as explained in the answer below.

for an example in jsfiddle, see

Related Query

More Query from same tag