【问题标题】:Highchart - Display JSON Data - MYSQL / PHPHighchart - 显示 JSON 数据 - MYSQL / PHP
【发布时间】:2011-10-14 12:36:15
【问题描述】:

我正在尝试在 Highchart 中显示 JSON DATA (http://highcharts.com)

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

我发现我必须将数据库中的日期数据转换为毫秒。

有人知道如何实现这一点吗?

这是我的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]]

【问题讨论】:

    标签: php mysql json highcharts


    【解决方案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 值。它必须是一个以毫秒为单位表示日期的数字。

    您可以通过以下方式之一进行更改来修复它 -

    1. Javascript(客户端)。
    2. 在您的 PHP 代码中
    3. 在您的 SQL 查询中。

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

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

    然后就做eval

    【讨论】:

    • 如果我这样做,将不再显示任何内容。
    • 是的,我更新了 JSON 数据并解决了之前的问题......但现在我想将我的日期时间从数据库转换为毫秒......有什么想法吗? :-)
    • 感谢您的支持:答案是您将我的日期时间转换为毫秒。 $rows[$i]=array(strtotime($row[savedate])*1000 ,$row[stand]);真的有必要做eval吗?
    • @JanineKroser:因为setData 函数将 Javascript 数组作为参数而不是 JSON,所以只是为了解析。
    猜你喜欢
    • 1970-01-01
    • 2015-12-31
    • 1970-01-01
    • 2018-04-21
    • 1970-01-01
    • 2013-10-20
    • 2015-03-14
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多