Highcharts - 仅显示特定类别中的特定系列?

时间:2015-05-12 02:41:24

标签: javascript jquery highcharts

我试图弄清楚是否可以使用Highchart的各种选项来仅显示特定类别中的特定系列列。我试图将数据分组,但并非所有组都有所有系列的数据,并且有大量的类别和系列,它为每个类别中的每个系列保留了大量的空间,而我如果可能的话,我们希望它不会在特定的类别中呈现特定的列。

此外,我想知道从概念上讲我是否做错了,并且应该从不同的角度来看待这个问题。我意识到我可以将这个单系列图表巧妙地命名为类别,但是我试图将这些内容组合在一起,更不用说报告本身是由专有的生成器生成的,所以很难& #34;知"从人类如何看待它的角度来看,会有什么样的数据回归。

你可以在这里看到一个例子:

参考:http://jsfiddle.net/gmpa7f7h/

$(function () {
    $('#container').highcharts({
        chart: {
            type: 'column'
        },
        title: {
            text: 'Stacked bar chart'
        },
        xAxis: {
            categories: ['West','East','North','South']
        },
        yAxis: {
            min: 0,
            title: {
                text: 'Total fruit consumption'
            }
        },
        legend: {
            reversed: true
        },
        plotOptions: {
            series: {

            }
        },
        series: [{
            name: 'Oneill',
            data: [3,0,0,0]
        }, {
            name: 'Jackson',
            data: [5, 0, 0, 0]
        }, {
            name: 'Tealc',
            data: [0, 9, 0, 0]
        }, {
            name: 'Carter',
            data: [0, 9, 0, 0]
        }, {
            name: 'McKay',
            data: [0, 0, 11, 0]
        }, {
            name: 'Hammond',
            data: [0, 0, 2, 0]

        }, {
            name: 'Mitchell',
            data: [0, 0, 0, 5]
        }, {
            name: 'Bratak',
            data: [0, 0, 0, 2]
        }]
    });
});

1 个答案:

答案 0 :(得分:0)

执行此操作的一种方法是使用(滥用)您开始使用的文档示例中的stack系列选项:

    series: [{
        name: 'Oneill',
        data: [3,0,0,0],
        stack: 'left'
    }, {
        name: 'Jackson',
        data: [5, 0, 0, 0]
    }, {
        name: 'Tealc',
        data: [0, 9, 0, 0],
        stack: 'left'
    }, {
        name: 'Carter',
        data: [0, 9, 0, 0]
    }, {
        name: 'McKay',
        data: [0, 0, 11, 0],
        stack: 'left'
    }, {
        name: 'Hammond',
        data: [0, 0, 2, 0]

    }, {
        name: 'Mitchell',
        data: [0, 0, 0, 5],
        stack: 'left'
    }, {
        name: 'Bratak',
        data: [0, 0, 0, 2]
    }]

然而,它不是非常优雅,而是对数据的形状做出假设。有了更多关于你最终会得到什么的信息,可能会有一个更好,更通用的解决方案。