2011-10-14 80 views
2

我試圖在一個Highchart(http://highcharts.comHighchart - 顯示JSON數據 - MYSQL/PHP

的問題,以顯示JSON數據爲x軸的數據。我真的很困惑如何獲取日期格式,以便它顯示在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]] 

回答

3

首先嚐試解析的數據( 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

+0

如果我這樣做,什麼都不會顯示了。 –

+0

@JanineKroser:哦,你更新你的JSON數據? –

+0

是的,我更新了JSON數據,然後我解決了這個問題......但現在我想將我的datetime從數據庫轉換爲毫秒......任何想法? :-) –