Page 1 sur 1

Php,Mysql,Json & highcharts

Posté : 15 sept. 2010, 13:53
par zexus
Bonjour,
je viens de découvrir http://www.highcharts.com/ et j'aimerai l'utiliser pour réaliser des graphes a partir de données Mysql.
d'après le support il faut passer par Json, comme vous pouvez voir sur mon post http://highslide.com/forum/viewtopic.php?f=9&t=7611 j'ai réussi a extraire les données puis les afficher
requête Mysql :

Code : Tout sélectionner

<?php $query =mysql_query("select date_format(connect_time,'%Y-%m-%d %H %i') AS date, Customers.name as customer, Sum(duration) as secondes from CDR_Vendors inner join Customers on (CDR_Vendors.i_customer = Customers.i_customer) where connect_time between '2010-09-01 00:00:00' and '2010-09-01 00:10:00' group by date ORDER BY date") or die(mysql_error());


j'aimerai obtenir le résultat suivant avec json

Code : Tout sélectionner

series: [{ name: 'Customer_1', data: [107, 31, 635, 203, 2] }, { name: 'Customer_3', data: [133, 156, 947, 408, 6] }, { name: 'Customer_3', data: [973, 914, 4054, 732, 34] }]
Merci d'avance.

Re: Php,Mysql,Json & highcharts

Posté : 15 sept. 2010, 17:07
par jojolapine
Bonjour,
où en es-tu actuellement?
Un print_r/var_dump du résultat de la requête ne serait pas du luxe...

Re: Php,Mysql,Json & highcharts

Posté : 15 sept. 2010, 17:23
par zexus
Bonjour,
Merci pour ta réponse,
résultat de var_dump($row)

Code : Tout sélectionner

array(3) { ["date"]=> string(16) "2010-09-13 00 00" ["customer"]=> string(10) "customer_1" ["secondes"]=> string(4) "3985" } array(3) { ["date"]=> string(16) "2010-09-13 00 01" ["customer"]=> string(10) "customer_2" ["secondes"]=> string(4) "8062" } array(3) { ["date"]=> string(16) "2010-09-13 00 02" ["customer"]=> string(10) "customer_3" ["secondes"]=> string(4) "3346" } array(3) { ["date"]=> string(16) "2010-09-13 00 03" ["customer"]=> string(10) "customer_4" ["secondes"]=> string(4) "3763" } array(3) { ["date"]=> string(16) "2010-09-13 00 04" ["customer"]=> string(10) "customer_5" ["secondes"]=> string(4) "9127" }

Re: Php,Mysql,Json & highcharts

Posté : 15 sept. 2010, 17:41
par jojolapine
Et comment va-t-on faire apparaitre par magie ces données: [107, 31, 635, 203, 2] ?
Si elles ne sont pas retournées par la requête on va pas les inventer...

Re: Php,Mysql,Json & highcharts

Posté : 15 sept. 2010, 18:51
par zexus
Les données changent.
voici le résultat de la requête sql :

Code : Tout sélectionner

"date","customer","secondes" "2010-09-01 00 00","customer_1",7350 "2010-09-01 00 01","customer_1",4622 "2010-09-01 00 02","customer_1",3533 "2010-09-01 00 03","customer_2",3391 "2010-09-01 00 04","customer_2",2554 "2010-09-01 00 05","customer_1",6809 "2010-09-01 00 06","customer_1",945 "2010-09-01 00 07","customer_2",3489 "2010-09-01 00 08","customer_1",1687 "2010-09-01 00 09","customer_1",4498
comme résultat final je dois avoir ca:

Code : Tout sélectionner

serie :[ { name : 'customer_1', data :[7350, 4622,3533, 6809,945,1687,4498] }, { name : 'customer_2', data :[0,0,0, 3391,2554, 0,0,3489,0] }, ........ (selon le nombre de customers) ]
pour information : les données vont servir a réaliser un graphe avec la librairie Highcharts
Y = Secondes
X = Date

j'ai pu réaliser un graphe avec le code suivant :

Code : Tout sélectionner

<?php $query =mysql_query("select date_format(connect_time,'%Y-%m-%d %H %i') AS date, Customers.name as customer, Sum(duration) as secondes from CDR_Vendors inner join Customers on (CDR_Vendors.i_customer = Customers.i_customer) where i_vendor='32' and connect_time between '2010-09-01 00:00:00' and '2010-09-01 00:10:00' group by date ORDER BY date", $link) or die(mysql_error()); $row = mysql_fetch_assoc($query); $customer[] = $row['customer']; $json_secondes = array(); $json_date = array(); do{ $secondes[] = $row['secondes']; array_push($json_secondes, $row['secondes']); array_push($json_date, $row['date']); } while($row = mysql_fetch_assoc($query)); //echo json_encode($json_secondes,$row); //echo json_encode($json_date,$row); //echo join($secondes, ', '); ?> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Highcharts Example</title> <!-- 1. Add these JavaScript inclusions in the head of your page --> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script type="text/javascript" src="../js/highcharts.js"></script> <!-- 1a) Optional: the exporting module --> <script type="text/javascript" src="../js/modules/exporting.js"></script> <!-- 2. Add the JavaScript to initialize the chart on document ready --> <script type="text/javascript"> var chart; $(document).ready(function() { chart = new Highcharts.Chart({ chart: { renderTo: 'container', defaultSeriesType: 'column' }, title: { text: 'Monthly Average Rainfall' }, subtitle: { text: 'Source: WorldClimate.com' }, xAxis: { categories: <?php echo json_encode($json_date,$row);?> }, yAxis: { min: 0, title: { text: 'Rainfall (mm)' } }, legend: { layout: 'vertical', backgroundColor: '#FFFFFF', align: 'center', verticalAlign: 'top', x: 100, y: 70 }, tooltip: { formatter: function() { return ''+ this.x +': '+ this.y +' Min'; } }, plotOptions: { column: { pointPadding: 0.2, borderWidth: 0 } }, series: [{ name: '<?php echo join($customer, ', ');?>', data: [<?php echo join($secondes, ', ');?>] }] }); }); </script> </head> <body> <!-- 3. Add the container --> <div id="container" style="width: 1300px; height: 500px; margin: 0 auto"></div> </body> </html>


Le problème qui se pose dans ce cas : le code récupère les données d'un seul customer

Re: Php,Mysql,Json & highcharts

Posté : 15 sept. 2010, 19:11
par jojolapine
re,

alors voilà un exemple de comment faire, en sachant que ton souhait est illogique...
Comment à partir des données que tu as fournis, penses tu avoir ça:
{
name : 'customer_1',
data :[7350, 4622,3533, 6809,945,1687,4498]
},
{
name : 'customer_2',
data :[0,0,0, 3391,2554, 0,0,3489,0]
}
Pourquoi le résultat ne serais pas?
{
name : 'customer_1',
data :[7350, 4622,3533, 0, 0, 6809,945, 0, 1687,4498]
},
{
name : 'customer_2',
data :[0,0,0, 3391,2554, 0,0,3489,0,0]
}
En gros comment peux-tu sur le papier donner des valeurs par défaut, à tes secondes, sachant qu'en plus les dates ne sont pas du tout les mêmes?

Bon pour la base ça donne ça:
<?php

$donnees = array(
array("date"=>"2010-09-01 00 00","customer"=>"customer_1","secondes"=>7350),
array("date"=>"2010-09-01 00 01","customer"=>"customer_1","secondes"=>4622),
array("date"=>"2010-09-01 00 02","customer"=>"customer_1","secondes"=>3533),
array("date"=>"2010-09-01 00 03","customer"=>"customer_2","secondes"=>3391),
array("date"=>"2010-09-01 00 04","customer"=>"customer_2","secondes"=>2554),
array("date"=>"2010-09-01 00 05","customer"=>"customer_1","secondes"=>6809),
array("date"=>"2010-09-01 00 06","customer"=>"customer_1","secondes"=>945),
array("date"=>"2010-09-01 00 07","customer"=>"customer_2","secondes"=>3489),
array("date"=>"2010-09-01 00 08","customer"=>"customer_1","secondes"=>1687),
array("date"=>"2010-09-01 00 09","customer"=>"customer_1","secondes"=>4498)
);


foreach($donnees as $donnee){
    
    if(!isset($donnees_json[$donnee['customer']])){
        
        $donnees_json[$donnee['customer']] = array(
            'name'=>$donnee['customer'],
            'data'=>array($donnee['secondes'])
        );
    }
    else {
        $donnees_json[$donnee['customer']]['data'][]=$donnee['secondes'];
    }
}

$donnees_json_final = array();

foreach($donnees_json as $donnee_json){
    $donnees_json_final[]=$donnee_json;
}
$donnees_json_final = array('serie'=>$donnees_json_final);

print_r(json_encode($donnees_json_final));

Re: Php,Mysql,Json & highcharts

Posté : 15 sept. 2010, 20:16
par zexus
Merci, je teste

Re: Php,Mysql,Json & highcharts

Posté : 20 sept. 2010, 18:51
par zexus
Bonjour,
après plusieurs tentatives pas de résultat avec Json mais ca marche si on utilise 2 pages , une pour la requête et une deuxième pour la source Highcharts qui fait appel a la première (Include).

1ere page (requête) :

Code : Tout sélectionner

<?php $n=5; $i=0; for ($t=$n;$t>0;$t--) { $i=$i+1; $categories[$i]=date("Y-m-d", strtotime("-".$t." day")); } $query="select date(connect_time) as date, sum(duration)/60 as minutes, Customers.name as customer from CDR_Vendors inner join Customers on (Customers.i_customer=CDR_Vendors.i_customer) where Customers.name like 'En-%' and (connect_time like ''"; for($t=1;$t<=$n;$t++){$query.=" or connect_time like '".$categories[$t]."%'";} $query.=") group by customer,date"; $donnee=mysql_query($query,$link) or exit(mysql_error()); $i=0; $products[0]=a; while ($row = mysql_fetch_assoc($donnee)) { $product=$row['customer']; $x=$row['date']; $data[$product][$x]=$row['minutes']; if($product!=$products[$i]) { $i=$i+1;$products[$i]=$product; } } for ($i=1;$i<count($products);$i++) { for ($j=1;$j<=count($categories);$j++) { if(isset($data[$products[$i]][$categories[$j]])) $valeur[$products[$i]][$categories[$j]]=$data[$products[$i]][$categories[$j]]; else $valeur[$products[$i]][$categories[$j]]=0; } } ?>
2eme page (Récupération des données + Code Highcharts ) :

Code : Tout sélectionner

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Highcharts Example</title> <!-- 1. Add these JavaScript inclusions in the head of your page --> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script type="text/javascript" src="../js/highcharts.js"></script> <!-- 1a) Optional: the exporting module --> <script type="text/javascript" src="../js/modules/exporting.js"></script> <!-- ***récupération des données*** --> <?php include("query_queryinc.php");?> <!-- 2. Add the JavaScript to initialize the chart on document ready --> <script type="text/javascript"> var chart; $(document).ready(function() { chart = new Highcharts.Chart({ chart: { renderTo: 'container', defaultSeriesType: 'bar' }, title: { text: 'Monthly Average Rainfall' }, subtitle: { text: 'Source: portaone' }, xAxis: { categories: [<?php for ($j=1;$j<=count($categories);$j++){echo "'".$categories[$j]."',";}?>] }, yAxis: { min: 0, title: { text: 'Minutes (mm)' } }, legend: { layout: 'horizontal', backgroundColor: '#FFFFFF', align: 'center', verticalAlign: 'bottom', }, tooltip: { formatter: function() { return ''+ this.x +': '+ this.y +' mm'; } }, plotOptions: { column: { pointPadding: 0.2, borderWidth: 0 } }, <?php echo " series: ["; for ($i=1; $i<count($products);$i++) { echo"{ name: ' ".$products[$i]." ', data: ["; for ($j=1;$j<=count($categories);$j++) {echo $valeur[$products[$i]][$categories[$j]].",";} echo "]},"; } echo " ]";?> }); }); </script> </head> <body> <!-- 3. Add the container --> <div id="container" style="width: 500px; height: 400px; margin: 0 auto"></div> </body> </html>
voila avec tout ca j'arrive a a voir un résultat, est ce possible d'optimiser le code ?
Merci