帶有多色區域的 Highcharts 折線圖

Question

我是 highCharts 的新手，我正在嘗試使用 Multicolored Area 獲取 LineChart 。 我在論壇甚至堆棧溢出上搜索了很多，但沒有找到。 附加圖像格式作為我想要的。

我試過這個FiddleLink 。

$(function () {
    $('#container').highcharts({
        chart: {
            type: 'area'
        },
        series: [{
            name: 'USA',
            data: [10,20,30,null,40,50]
        }, {
            name: 'USSR/Russia',
            data: [null,null,30,66,40]
        },
         {
            name: 'INIA',
            data: [null,null,55,66,40]
        }]
    });
});

因此，如果有人幫助我，這對我來說將是一個很大的幫助。``

Answer 1

您應該能夠通過使用plotBands功能實現想要的效果。

演示： http : //jsfiddle.net/BlackLabel/zex0rgdu/

xAxis: {
  plotBands: [{
    color: '#FCFFC5',
    from: 0,
    to: 2
  }, {
    color: 'red',
    from: 2,
    to: 4
  }, {
    color: 'blue',
    from: 4,
    to: 5
  }],
},

API： https : //api.highcharts.com/highcharts/xAxis.plotBands