Question

我可以请求帮助显示基于时间标签的高图的x轴。图表跨越30个小时，我的json在数据部分有690个元素。我的json格式是这样的......

[{
    "name": "seriesName",
    "data": [
        0.04,
        0.04,
        0.07,
        0.44,
        0.12,
        0,
        0.80,
        -0.02
    ]
}]

从本质上讲，每23个元素标记一个新小时的开始，图表从前一天的18:00开始，直到今天23:59。

我已经把一个小提琴放在一起帮助显示我遇到的问题。对不起，由于某种原因，我只是没有得到xAxis - tickInterval，plotOptions - series - pointInterval和pointStart之间的关系。

http://jsfiddle.net/JohnnyRS/24m1b19b/1/

我的json数组是否应该有另一个元素来表示每个值点的时间？我想显示一个代表每个新工作时间的刻度，从前一天的18:00到今天的午夜。

就是这种情况很重要，我还应该提一下，小提琴只是图表的一种表示，因为我在点击按钮后从mySQL数据库中收集数据。这就是我如何构建图表......

jQuery("document").ready(function() {
    var options = {
            chart: { … },
            xAxis: { … },
            yAxis: { … },
            plotOptions: { … },
            series: [{}]
    }; // var options

    loadSeries();   
    function loadSeries(){
        $.post("//somePath/test.php", data, function(json) {
            options.series[0] = json[0];
            options.series[1] = json[1];
            options.series[2] = json[2];
            options.series[3] = json[3];

            var chart = new Highcharts.Chart(options);

            chart.series[0].options.animation = false;
            chart.series[0].options.lineWidth = 1;
            chart.series[0].update(chart.series[0].options);

            chart.series[1].options.animation = false;
            chart.series[1].options.lineWidth = 1;
            chart.series[1].update(chart.series[1].options);
        }, "json"); // $.post
    } // loadSeries

    $('#btn').click(function() {
        loadSeries();
    });
}); // ready

感谢您抽出宝贵时间阅读帖子。

Answer 1

是的，您可以使用数字数组指定时间，第一个索引代表时间，第二个代表值。

  data: [
                [Date.UTC(2000,  9, 27), 0   ],
                [Date.UTC(2000, 10, 10), 0.6 ],
                [Date.UTC(2000, 10, 18), 0.7 ],
                [Date.UTC(2000, 11,  2), 0.8 ],
                [Date.UTC(2000, 11,  9), 0.6 ],
                [Date.UTC(2000, 11, 16), 0.6 ],
                [Date.UTC(2000, 11, 28), 0.67],
                [Date.UTC(2001,  1,  1), 0.81],
                [Date.UTC(2001,  1,  8), 0.78],
                [Date.UTC(2001,  1, 12), 0.98]

            ]

请参阅此处的示例：http://jsfiddle.net/0v6LphLd/

Highcharts - 如何将轴显示为时间

1 个答案: