Question

我有一个要显示为网格图的时间序列数据：

以下是Highcharts网站上的“网格图”的基本版本：

我正在代替Erik，Gert，Helge，Torstein，将其替换为以下组：Client，DII，FII，PRO。

在下面的图表中，水果名称是一个简单的序列，但是在这里我有一个时间序列数据： Fut Index Longs和Fut Index Shorts 。上述每个分组（客户，DII ...）都有自己的Fut Index Long和Fut Index Shorts版本。

我想将Fut Index Longs，Fut Index Shorts与x轴堆叠起来表示不同的日子。

我尝试使用嵌套序列来完成此操作，但是没有显示任何数据。这是我的消息来源：

var charts = [],
    $containers = $('#trellis td'),

datasets = [
    {
        name: 'Client',
        data: 
            [
                {
                    name: "Fut Index Longs",
                    data: [["2014-02-10", 5], ["2014-02-11", 9], ["2014-02-12", 7]]
                },
                {
                    name: "Fut Index Shorts",
                    data: [["2014-02-10", 5], ["2014-02-11", 9], ["2014-02-12", 2]]
                }
            ]
    },
    {
        name: 'DII',
        data: 
            [
                {
                    name: "Fut Index Longs",
                    data: [["2014-02-10", 5], ["2014-02-11", 9], ["2014-02-12", 7]]
                },
                {
                    name: "Fut Index Shorts",
                    data: [["2014-02-10", 5], ["2014-02-11", 9], ["2014-02-12", 2]]
                }
            ]
    },
    {
        name: 'FII',
        data: 
            [
                {
                    name: "Fut Index Longs",
                    data: [["2014-02-10", 5], ["2014-02-11", 9], ["2014-02-12", 7]]
                },
                {
                    name: "Fut Index Shorts",
                    data: [["2014-02-10", 5], ["2014-02-11", 9], ["2014-02-12", 2]]
                }
            ]
    },
    {
        name: 'PRO',
        data: 
            [
                {
                    name: "Fut Index Longs",
                    data: [["2014-02-10", 5], ["2014-02-11", 9], ["2014-02-12", 7]]
                },
                {
                    name: "Fut Index Shorts",
                    data: [["2014-02-10", 5], ["2014-02-11", 9], ["2014-02-12", 2]]
                }
            ]
    }
];


$.each(datasets, function(i, dataset) {
    charts.push(new Highcharts.Chart({

        chart: {
            renderTo: $containers[i],
            type: 'bar',
            marginLeft: i === 0 ? 100 : 10
        },

        title: {
            text: dataset.name,
            align: 'left',
            x: i === 0 ? 90 : 0
        },

        credits: {
            enabled: false
        },

        xAxis: {
                    type: 'datetime'
            },

        yAxis: {
            allowDecimals: false,
            title: {
                text: null
            },
            min: 0,
            max: 10
        },

        plotOptions: {
        column: {
            stacking: 'normal'
            }
            },

        legend: {
            enabled: false
        },

        series: [dataset]

    }));
});

jsfiddle的链接：http://jsfiddle.net/g6jLhux2/

我在做什么错了？

Answer 1

根据您的情况，您需要使用

series: dataset.data

此外，您的x轴不是日期时间，而是类别，因为日期时间应该以数字（毫秒）的形式传递。然后，您必须使用：

xAxis: {
  type: 'category'
},

如果要在图表中正确显示数据。 See updated jsfiddle

对您有帮助吗？

在高图表中将网格图与堆积的列一起使用

1 个答案: