Highchart - Affichage des Données JSON - MYSQL / PHP
J'essaie d'afficher les DONNÉES JSON dans un Highchart (http://highcharts.com)
Le problème, les données pour les xAxis. Je suis vraiment confus comment obtenir le format de la date, de sorte qu'il est affiché dans la xAxis.
J'ai découvert que j'ai pour convertir la date des données de la DB à quelques millisecondes.
Quelqu'un a une idée de comment réaliser cela?
C'est mon 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
});
}
C'est le PHP qui produit le JSON:
<?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);
;
?>
Les données 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]]
Vous devez vous connecter pour publier un commentaire.
D'abord d'essayer d'analyser les données (JSON) avant de les passer en argument à
setData
-Mise à jour:
"2011-03-20 18:53:47"
n'est pas valide valeur x pour un datetime de la série. Il doit ba un nombre qui représente la date en millisecondes.Vous pouvez y remédier en faisant le changement dans l'un des formats suivants -
Faire soit dans votre requête SQL ou PHP, de sorte que vous n'aurez pas à jouer avec Javascript et que votre JSON va ressembler à quelque chose comme -
Puis après ça, il suffit de ne
eval
.setData
fonction prend Javascript tableau comme argument non JSON afin d'analyser.