Question

我正在尝试在Highchart（http://highcharts.com）

中显示JSON数据

问题是xAxis的数据。我真的很困惑如何获取日期格式，以便它显示在xAxis中。

我发现我必须将日期数据从DB转换为毫秒。

有人知道如何实现这个目标吗？

这是我的javascript：

    var chart;

 chart = new Highcharts.Chart({
    chart: {
            renderTo: 'container',
            defaultSeriesType: 'spline',
            events: {
                load: requestData
            }},
    xAxis: {
         type: 'datetime'
      },
      yAxis: {
         title: {
            text: 'Value'
         },
         plotLines: [{
            value: 0,
            width: 1,
            color: '#808080'
         }]
      },

    series: [{
         name: 'Random data',
         data: []
        }]
});



function requestData() {
    $.ajax({
        url: '../controller/charter/data.php',
        datatype: "json",
        success: function(data) {

            alert(data);

            chart.series[0].setData(data);

        },
        cache: false
    });
}

这是生成JSON的PHP：

 <?php
header("Content-type: text/json");
// connect to the database
$dbhost = "localhost";
$dbuser = "cccccc";
$dbpassword = "ccccccc";
$database = "ccccccccc";
$tablename = "ccccccc";
$db = mysql_connect($dbhost, $dbuser, $dbpassword)
or die("Connection Error: " . mysql_error());

mysql_select_db($database) or die("Error conecting to db.");
$result = mysql_query("SELECT COUNT(*) AS count FROM $tablename");
$row = mysql_fetch_array($result,MYSQL_ASSOC);

$SQL = "SELECT aed,savedate FROM $tablename ORDER BY savedate";

$result = mysql_query( $SQL ) or die("Couldn?t execute query.".mysql_error());

$i=0;
while($row = mysql_fetch_array($result,MYSQL_ASSOC)) {

    $row[aed] = (int) $row[aed];

    $rows[$i]=array($row[savedate],$row[aed]);

    $i++;
}

echo json_encode($rows);

;
?>

JSON数据：

[["2011-03-20 18:53:47",40],["2011-03-21 18:53:47",300],["2011-03-22 18:53:47",450],["2011-03-23 18:53:47",40],["2011-03-24 18:53:47",300],["2011-03-25 18:53:47",450],["2011-03-26 18:53:47",40],["2011-03-29 18:53:47",120],["2011-03-29 18:53:47",80],["2011-03-29 18:53:47",300],["2011-03-29 18:53:47",450],["2011-03-29 18:53:47",40],["2011-03-29 18:53:47",100],["2011-03-29 18:53:47",120],["2011-03-29 18:53:47",80],["2011-03-29 18:53:47",300],["2011-03-29 18:53:47",450],["2011-03-29 18:53:47",100],["2011-03-29 18:53:47",40],["2011-03-29 18:53:47",120],["2011-03-29 18:53:47",80],["2011-03-29 18:53:47",300],["2011-03-29 18:53:47",450],["2011-03-29 18:53:47",40],["2011-03-29 18:53:47",100],["2011-03-29 18:53:47",120],["2011-03-29 18:53:47",80],["2011-03-29 18:53:47",300],["2011-03-29 18:53:47",450],["2011-03-29 18:53:47",40],["2011-03-29 18:53:47",300],["2011-03-29 18:53:47",450],["2011-03-29 18:53:47",40],["2011-03-29 18:53:47",300],["2011-03-29 18:53:47",450],["2011-03-29 18:53:47",100]]

Answer 1

首先尝试解析数据（JSON），然后将其作为参数传递给setData -

chart.series[0].setData( eval( '(' + data + ')' ) );

<强>更新

[["2011-03-20 18:53:47",40],["2011-03-21 18:53:47",300],...]

"2011-03-20 18:53:47"不是日期时间序列的有效x值。它必须是一个以毫秒为单位表示日期的数字。

您可以通过更改以下其中一项来修复它 -

Javascript（客户端）。
在您的PHP代码中
在您的SQL查询中。

在SQL查询或PHP中执行此操作，这样您就不必使用Javascript，并且您的JSON看起来像 -

[[1318605385652, 40],[1318605385652,300],...]

然后在那之后做eval。

Highchart - 显示JSON数据 - MYSQL / PHP

1 个答案: