在Highcharts中的类别中的每列上的样条线

Question

如何在Highcharts中的每个类别的列上绘制样条线？

比方说，我在x轴上有5个类别，每个类别有4列。现在我想要一个样条，它通过类别中的所有4列（每个类别应在其相应的列上有一个单独的样条线）

类别和列是否可以动态更改？

Answer 1

对于column系列，您可以禁用grouping并将pointPlacement设置为数字值。然后，您可以为x系列设置spline数据值以使它们适合列：

Highcharts.chart('container', {
    chart: {
        type: 'column'
    },
    xAxis: {
        type: 'category',
        startOnTick: true,
        min: 0
    },
    plotOptions: {
        series: {
            grouping: false,
            pointWidth: 20
        }
    },
    series: [{
        data: [1, 1, 1, 1, 1],
        pointPlacement: -0.3
    }, {
        data: [2, 2, 2, 2, 2],
        pointPlacement: -0.1
    }, {
        data: [3, 3, 3, 3, 3],
        pointPlacement: 0.1
    }, {
        data: [4, 4, 4, 4, 4],
        pointPlacement: 0.3
    }, {
        type: 'spline',
        pointRange: 11,
        data: [
            [-0.3, 1],
            [-0.1, 2],
            [0.1, 3],
            [0.3, 4]
        ]
    }, {
        type: 'spline',
        pointRange: 11,
        data: [
            [0.7, 1],
            [0.9, 2],
            [1.1, 3],
            [1.3, 4]
        ]
    }]
});

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

API参考：

https://api.highcharts.com/highcharts/series.column.grouping

https://api.highcharts.com/highcharts/series.column.pointWidth

https://api.highcharts.com/highcharts/series.column.pointPlacement