Question

如何将多个系列仅封装为一个系列作为其父容器？

以下是示例：http://jsfiddle.net/robertpeter07/hNkAA/6/

$(function () {
    Highcharts.setOptions({
        colors: ['#1c3340', '#94b05a', '#386580', '#e8d78c', '#6c5f36', '#899fa8']
    });

    $('#container').highcharts({
        chart: {
            type: 'column',
            backgroundColor: 'transparent',
            setToMargin: 50
        },
        title: {
            text: null 
        },
        xAxis: {
            gridLineWidth: 0,
            minorGridLineWidth: 0,
            tickLength: 0,
            categories: ['Jan 2014', 'Feb 2014']
        },
        yAxis: {
            allowDecimals: true,
            gridLineWidth: 0,
            minorGridLineWidth: 0,
            lineWidth: 1,
            tickWidth: 1,
            ceiling: 100,
            title: {
                text: null
            },
            labels: {
                format: '{value}%'
            }
        },
        credits: {
            enabled: false
        },
        legend: {
            layout: 'vertical',
            align: 'right',
            verticalAlign: 'top',
            x: 0,
            y: 100,
            itemMarginTop: 10,
            itemMarginBottom: 10
        },
        plotOptions: {
            column: {
                stacking: 'normal',
                grouping: true,
                dataLabels: {
                    enabled: true,
                    inside: false,
                    format: '{y}%',
                    color: '#000000'
                },
                events: {
                    legendItemClick: function () {
                        //statement to disable clickevent of time off and GRM Delta
                    }

                }
                //pointWidth: 30
            }
        },
        tooltip: {
            valueSuffix: '%'
        },
        series: [{
            name: 'data1',
            data: [-12, -10],
            stack: 0,
            index: 1,
            //legendIndex: 0,
            dataLabels: {
                enabled: false
            }
        }, {
            name: 'data2',
            data: [-12, -10],
            stack: 0,
            index: 0,
            //legendIndex: 1
        }, {
            name: 'data3',
            data: [12, 17],
            stack: 1
        }, {
            name: 'data4',
            data: [8, 3],
            stack: 2
        }, {
            name: 'data5',
            data: [-13, -11],
            stack: 3
        }, {
            name: 'data6',
            data: [14, 13],
            stack: 4
        }]
    });
});

第一组应该是0％，只是一个例子
第二组应为15％或20％

有没有人有建议要做到这一点？

这里具体是示例图像： Sample multiple series image

Answer 1

一般来说，这不是一件容易的事，但可以实现。关键选项是threshold，它可以设置您需要的翻译。但是，每个系列仅支持一个阈值。然后，为了克服这个问题，我们将为每个类别使用不同的系列，但使用linkedTo连接到第一个。演示：http://jsfiddle.net/hNkAA/7/

简而言之，主要系列：

    {
        name: 'data1',
        id: 'data1', //set ID for children series
        data: [-12], //one series = one point for category
        stack: 0,
        index: 1,
        //legendIndex: 0,
        dataLabels: {
            enabled: false
        }
    }

连接不同起点的系列：

    {
        threshold: 10, //base for that series will be 10, not default 0
        name: 'data1', 
        linkedTo: 'data1', //link to master series
        data: [[1, -10]], //set point only for second category
        stack: 0,
        index: 0,
        //legendIndex: 1
    }

highchart - 如何将多个系列封装为一个系列作为其父系列

1 个答案: