Highchart data series filled with different colors

问题

I need to figure out how to color the same data series points with different colors in Highcharts. For example, let's say I have a data series for several days and I would like to have a line graph. In this line specific days should be distinguish (maybe colored by some color).

回答1:

Try using the fillColor property:

{
    name: 'xyz',
    x: 123,
    y: 456,
    fillColor: '#00FF00'
}

回答2:

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 http://jsfiddle.net/xqWp5/1/

回答3:

Yes you can just use plotOptions.area.zones :

https://api.highcharts.com/highcharts/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
    }
},

http://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/css/color-zones/

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

回答4:

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.

来源：https://stackoverflow.com/questions/11416554/highchart-data-series-filled-with-different-colors