如何根据xrange highcharts中的plotBand选项自动调整条形？

Question

我已经为xrange图表应用了plotBand选项，其中第一行小于第二行，但是在调整窗口大小时，数据系列不与plotBand区域对齐。

目前我正在使用css修改系列的y和height，有没有办法让它在窗口大小调整期间动态适应plotBand区域。

的jsfiddle：http://jsfiddle.net/karnan796/t1Ldnc69/13/

绿色条也没有与plotBand区域对齐

Answer 1

您需要将plotBands调整为groupPadding值：

Highcharts.chart('container', {
    ...,
    yAxis: {
        plotBands: [{
            from: -0.3,
            to: 0.3,
            color: '#00401f'
        }, {
            from: 0.7,
            to: 1.3,
            color: '#2f4776'
        }],
        ...
    },
    series: [{
        pointPadding: 0,
        groupPadding: 0.2,
        ...
    }]
});

现场演示：http://jsfiddle.net/BlackLabel/orpvc50t/

API参考：

https://api.highcharts.com/highcharts/series.xrange.groupPadding

https://api.highcharts.com/highcharts/series.xrange.pointPadding