如何在Highchart中移动线系列？

Question

我有这种高级格式：

    series:[{
        name: 'X',
        type: 'column',
        color: '#F4811F'
    },{
        name: 'Y',
        type: 'column',
        color: '#8EB950'
    },{
        name: 'Z',
        type: 'column',
        color: '#5C97D3'
    }, {
        name: 'AvgX',
        type: 'line',
        lineWidth: 4,
        color: '#F4811F'
    }, {
        name: 'AvgY',
        type: 'line',
        lineWidth: 4,
        color: '#8EB950'
    }, {
        name: 'AvgZ',
        type: 'line',
        lineWidth: 4,
        color: '#5C97D3'
    }]

显示的图表是这样的

如何将AvgX移到X上并将AvgZ移到Z上？ Highchart中有什么选项可以做到这一点吗？

Answer 1

您可以为pointPlacement系列设置正确的line属性：

series: [{
    name: 'X',
    type: 'column',
    color: '#F4811F',
    data: [1, 1, 1]
}, {
    name: 'Y',
    type: 'column',
    color: '#8EB950',
    data: [1, 1, 1]
}, {
    name: 'Z',
    type: 'column',
    color: '#5C97D3',
    data: [1, 1, 1]
}, {
    name: 'AvgX',
    type: 'line',
    lineWidth: 4,
    pointPlacement: -0.2,
    color: '#F4811F',
    data: [2, 2, 2]
}, {
    name: 'AvgY',
    type: 'line',
    lineWidth: 4,
    color: '#8EB950',
    data: [3, 3, 3]
}, {
    name: 'AvgZ',
    type: 'line',
    lineWidth: 4,
    pointPlacement: 0.2,
    color: '#5C97D3',
    data: [4, 4, 4]
}]

实时演示：http://jsfiddle.net/BlackLabel/m4y0xepo/

API：https://api.highcharts.com/highcharts/series.line.pointPlacement