Highcharts:不显示值,日期时间类型

时间:2014-11-13 23:40:33

标签: javascript highcharts

我正试图解决这个问题,但我不知道该怎么做......

这是我目前的演示代码: http://jsfiddle.net/cf88s6ky/

这个有效,但我不知道如何: http://jsfiddle.net/93Xcu/7/

我做错了什么?

我不确切知道这部分是如何运作的:

  data: [
            [1369206795000, 1],
            [1369225421000, 3],
            [1369230934000, 2]
        ]

enter image description here

2 个答案:

答案 0 :(得分:1)

数据数组中的第一列是时间戳 - 更新图表上没有显示任何内容的原因是您已经调整了x轴范围,但时间戳超出了这个新范围。

为了使时间值更具可读性,您可以将其更改为:

$(function () {
    $('#container').highcharts({
        chart: {
            zoomType: 'x'
        },
        xAxis: {
            type: 'datetime',
            tickInterval: 3600 * 1000,
            min: Date.UTC(2014,11,14),
            max: Date.UTC(2014,11,15),
        },
        series: [{
            data: [
                [Date.UTC(2014,11,14, 0, 0, 0), 1],
                [Date.UTC(2014,11,14, 8, 0, 0), 3],
                [Date.UTC(2014,11,14, 16, 0, 0), 2]
            ],
            pointStart: Date.UTC(2014,11,14),
            pointInterval: 24 * 3600 * 1000 // one day
        }]
    });
});

答案 1 :(得分:1)

这是一个以秒为单位的全时转换或者作为X数据传递到您的图表的东西,并且由于您更改了超出范围值的时间的最小值和最大值,因此您没有任何演示你的数据。

我建议您编写自己的数据转换。在这种情况下,如果你想让每日值在X轴上使用这样的东西。

xAxis: {
        min: 0,
        max: 86400,
            reversed: false,
            title: {
                enabled: true,
                text: 'Time'
            },
            labels: {
                formatter: function () {
                    return Math.floor(this.value/3600) + ":" + Math.floor((this.value%3600)/60);
                }
            }
}

您需要在每个系列中以[time_in_seconds,value]的格式传递数据元素。