Highcharts中的日期无效,JSON加载了数据

时间:2012-06-04 19:39:16

标签: jquery json highcharts

我似乎无法在Highcharts中获取xAxis来显示通过JSON加载的数据的日期。此外,当我将鼠标悬停在数据点上时,标签显示“日期无效。”

以下是用于生成数据的PHP代码:

function fetchLineChart() {
    $fetchData = $this->db->query("SELECT download, upload, date FROM speed_entries ORDER BY date DESC");

    while ($data = $fetchData->fetch()) {
        $date = date("Y, m, d", strtotime($data['date']));
        $downloadData[] = array('Date.UTC(' . $date . ')', (float)$data['download']);
        $uploadData[] = array('Date.UTC(' . $date . ')', (float)$data['upload']);
    }
    $result = array('download' => $downloadData, 'upload' => $uploadData);
    echo json_encode($result);
}

这是图表的jQuery

$(document).ready(function() {
                var options = {
                    chart: {
                        renderTo: 'lineChart',
                        type: 'line'
                    },
                    title: {
                        text: 'Download / Upload Results'
                    },
                    subtitle: {
                        text: 'Source: Speedtest.net'
                    },
                    yAxis: {
                            title: {
                                    text: 'Speed'
                            },
                            plotLines: [{
                                    value: 0,
                                    width: 1,
                                    color: '#808080'
                            }]
                    },
                    xAxis: {
                        type: 'datetime'
                     },
                    series: [{
                        name: 'Download',
                        lineWidth: 2,
                        marker: {
                            radius: 2
                        },
                        data: []
                    }, {
                        name: 'Upload',
                        data: []
                    }]
                };

                $.getJSON('class.speed.php?mode=lineChart', null, function(json) {
                    var downloads = json.download;
                    var uploads = json.upload;

                    options.series[0].data = downloads;
                    options.series[1].data = uploads;

                    chart = new Highcharts.Chart(options);
                });
            });

其他一切正常,数据线正确显示。只是无法弄清楚如何使日期工作。

由于

1 个答案:

答案 0 :(得分:0)

我可能在这里错了,但是通过将xAxis设置为' datetime',你告诉Highcharts他们你将以毫秒(即整数)的形式提供日期,而不是你传递的字符串。为什么你没有像Linger已经建议的那样直接在你的php函数中生成毫秒?

$miliseconds = strtotime($data['date']) * 1000;
$downloadData[] = array($miliseconds, (float)$data['download'])