在折线图highchart的背景专栏

Question

我必须做这样的图表

image

已创建折线图，其图例和轴标签。只缺少列。我不知道怎么做，你能帮帮我吗？

Answer 1

我在xAxis上使用plotBands来创建类似的东西。将它与您的项目混合应该返回想要的结果。

xAxis: {
    plotBands: [{
            borderColor: 'grey',
        borderWidth: 3,
        color: '#FCFFC5',
        from: Date.UTC(2019, 02, 2),
        to: Date.UTC(2019, 02, 4)
    }, { // mark the weekend
        color: '#FCFFC5',
        from: Date.UTC(2019, 02, 9),
        to: Date.UTC(2019, 02, 11)
    }, { // mark the weekend
        color: '#FCFFC5',
        from: Date.UTC(2019, 02, 16),
        to: Date.UTC(2019, 02, 18)
    }, { // mark the weekend
        color: '#FCFFC5',
        from: Date.UTC(2019, 02, 23),
        to: Date.UTC(2019, 02, 25)
    }, { // mark the weekend
        color: '#FCFFC5',
        from: Date.UTC(2019, 02, 30),
        to: Date.UTC(2019, 03, 1)
    }],
    tickInterval: 24 * 3600 * 1000, // one day
    type: 'datetime',
},

Link to demo