Boucle sur graphique google chart

Version imprimable

Voir 40 message(s) de cette discussion en une page

pour l'instant j'ai abandonné la boucle je reste sur la fonction initiale donc les fonctions drawchart et drawunechart que tu m'as indiquées je les mets de cîté;
je voudrais bien faire fonctionner ce fichu tableau JS
-j'ai viré le echo $tableau_json (ça c'était pour voir à quoi ça ressemblait!)
-je mets le tableau 1 dans donne avec

Code:

var donnee = tableau["1"];

j'ai donc fait les modifs qui me semblait nécessaire mais......rien

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
<?php
$conn_string = "host=localhost port=5432 dbname=madb user=postgres password=pw";
$dbconn = pg_connect($conn_string);
 
 
    $sql= "select ana_id, sta_date, arrondi(sta_valeur, ana_id) from tbl_stat_sta ";
  $sql.="where sta_esp = 1 and ana_id in(1,3,4,6) and (sta_date between '2011-01-01' and '2011-01-10') order by ana_id,sta_date;";
 
  $i=0;
  $result=pg_query($dbconn, $sql);
 
  while ($row = pg_fetch_row($result)) 
  {
  $tab = array( $row[1], $row[2]);
  $tableau[$row[0]][] = $tab;
}
 
 
 $tableau_json=json_encode($tableau);
 //echo $tableau_json;
  ?>
  <!DOCTYPE html>
<html>
  <head>
 
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
 
    <script type="text/javascript">
    var tableau = <?php echo $tableau_json?>;
 
    var donnee = tableau["1"];
 
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
 
 
      function drawChart() {
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'date');
        data.addColumn('number', 'MG');
        data.addRows(donnee);
 
 
        var chart = new google.visualization.LineChart(document.getElementById('div1'));
        chart.draw(data, {
        width: 700,
        height: 500,
        title: 'MG',
        curveType : 'function',
        colors:['green']});
      }
 
      </script>
  </head>
  <div id="div1"></div>
  </html>

code source généré :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
 
  <!DOCTYPE html>
<html>
  <head>
 
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
 
    <script type="text/javascript">
    var tableau = {"1":[["2011-01-04","44.64"],["2011-01-05","44.70"],["2011-01-06","43.26"],["2011-01-07","44.02"],["2011-01-08","43.95"]],"3":[["2011-01-04","290"],["2011-01-05","287"],["2011-01-06","293"],["2011-01-07","286"],["2011-01-08","311"]],"4":[["2011-01-04","522.0"],["2011-01-05","521.0"],["2011-01-06","525.0"],["2011-01-07","523.0"],["2011-01-08","523.0"]],"6":[["2011-01-04","255"],["2011-01-05","245"],["2011-01-06","275"],["2011-01-07","258"],["2011-01-08","250"]]};
 
    var donnee = tableau["1"];
 
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
 
 
      function drawChart() {
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'date');
        data.addColumn('number', 'MG');
        data.addRows(donnee);
 
 
        var chart = new google.visualization.LineChart(document.getElementById('div1'));
        chart.draw(data, {
        width: 700,
        height: 500,
        title: 'MG',
        curveType : 'function',
        colors:['green']});
      }
 
      </script>
  </head>
  <div id="div1"></div>
  </html>

06/04/2013, 15h45
NoSmoking

Citation:

pour l'instant j'ai abandonné la boucle je reste sur la fonction initiale

je pense que c'est une erreur car ton problème est ailleurs.

Citation:

Envoyé par dernier code transmis

Code:

var tableau = {"1":[["2011-01-04","44.64"],["2011-01-05","44.70"],["2011-01-06","43.26"],...etc...

Citation:

Envoyé par avant dernier code transmis

Code:

var tableau = {"1":"['2011-01-04', 44.64],['2011-01-05', 44.70],['2011-01-06', 43.26]...tec

comment ce fait-il que les données de valeurs soient devenues des text et non plus des float, présence des guillemets autour de la valeur.
06/04/2013, 18h02
triaguae

Citation:

Envoyé par NoSmoking

comment ce fait-il que les données de valeurs soient devenues des text et non plus des float, présence des guillemets autour de la valeur.

Ce que j'ai changé c'est la façon de faire le tableau en php : je suis passé de mon truc pas très beau au tient bien plus propre.
:arf:

voici un code qui marche avec la boucle :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
<?php
$conn_string = "host=localhost port=5433 dbname=madb user=postgres password=pw";
$dbconn = pg_connect($conn_string);
 
 
    $sql= "select ana_id, sta_date, arrondi(sta_valeur, ana_id) from tbl_stat_sta ";
  $sql.="where sta_esp = 1 and ana_id in(1,3,4,6,7,8,9) and (sta_date between '2011-01-01' and '2011-01-31') order by ana_id,sta_date;";
  
  $i=0;
  $result=pg_query($dbconn, $sql);
  
  while ($row = pg_fetch_row($result)) 
  {
  $tab = array( $row[1], $row[2]);
  $tableau[$row[0]][] = $tab;
}
 
 
 $tableau_json=json_encode($tableau, JSON_NUMERIC_CHECK);
 //echo $tableau_json;
  ?>
  <!DOCTYPE html>
<html>
  <head>
 
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
 
    <script type="text/javascript">
    var tableau = <?php echo $tableau_json?>;
 
    //var donnee = tableau[1];
 
 
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
 
      function drawChart() 
      {
       for (var i in tableau) 
        {
        drawUneChart('div'+i, tableau[i]);
        }
       }
 
 function drawUneChart(id, donnee) {
  var data = new google.visualization.DataTable();
  data.addColumn('string', 'date');
  data.addColumn('number', 'MG');
  data.addRows(donnee);
 
  var chart = new google.visualization.LineChart(document.getElementById(id));
  chart.draw(data, {
    width: 500,
    height: 500,
    title: 'MG',
    curveType: 'function',
    colors: ['green']
  });
}
 
 
 
      </script>
  </head>
 
  <div id="div1"></div>
  <div id="div3"></div>
  <div id="div4"></div>
  <div id="div6"></div>
  </html>

j'ai ajouté l'option JSON_NUMERIC_CHECK à la création de l'objet Json pour supprimer les guillemets.
la boucle que tu m'as fournie fonctionne
Il me reste à générer des div dynamiquement, et qq trucs comme les titres de graph et ce sera bon

merci pour ton aide

Citation:

j'ai ajouté l'option JSON_NUMERIC_CHECK à la création de l'objet Json pour supprimer les guillemets.

ce qui laisse à penser que la valeur est stockée en tant que text dans ta base.

Citation:

Il me reste à générer des div dynamiquement, ...

dans ce cas tu n'as surement pas besoin de gérer l'ID des DIV, il te suffit de tester si elle existe(!) et si non de la créer.

Cela peut donner
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 function drawUneChart(id, donnee) { var oDiv = document.getElementById(id); if( !oDiv){ oDiv = document.createElement('DIV'); oDiv.id = id; // pas forcément utile document.body.appendChild( oDiv); } var data = new google.visualization.DataTable(); data.addColumn('string', 'date'); data.addColumn('number', 'MG'); data.addRows(donnee); var chart = new google.visualization.LineChart( oDiv); chart.draw(data, { width: 500, height: 500, title: 'MG', curveType: 'function', colors: ['green'] }); }
à voir l'utilité du passage en paramètre de l'ID si non utile

concernant le stockage au format text dans la base, et bien non je suis en numeric

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
 
CREATE TABLE tbl_stat_sta
(
  sta_id bigserial NOT NULL,
  sta_date date,
  sta_esp integer,
  sta_valeur numeric(7,3),
  ana_id integer,
  CONSTRAINT sta_id PRIMARY KEY (sta_id),
  CONSTRAINT ana_id FOREIGN KEY (ana_id)
      REFERENCES tbl_analyse_ana (ana_id) MATCH SIMPLE
      ON UPDATE NO ACTION ON DELETE NO ACTION,
  CONSTRAINT sta UNIQUE (sta_date, sta_esp, ana_id)

et la fonction arrondi renvoi également du numéric :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
CREATE OR REPLACE FUNCTION arrondi(numeric, integer)
  RETURNS numeric AS
$BODY$
DECLARE 
s RECORD;
crit integer := $2;
nb integer;
cur CURSOR FOR SELECT ana_decimal FROM tbl_analyse_ana WHERE ana_id = crit;
 
BEGIN
	OPEN cur;
	LOOP
	FETCH NEXT FROM cur INTO s;
	EXIT WHEN NOT FOUND;
	nb := s.ana_decimal;
	END LOOP;
	CLOSE cur;
 
	RETURN round($1, nb);
END
$BODY$
  LANGUAGE plpgsql VOLATILE

Est-ce que ça pourrait être un paramétage de php?

Pour les div je vais voir ça

07/04/2013, 15h01
NoSmoking

Citation:

Est-ce que ça pourrait être un paramétage de php?

:oops: non, c'est dû à la méthode pg_fetch_row() qui renvoi un tableau dont chaque valeur est sous la forme d'une String, j'avais pas percuté re:oops:.

Il faut donc "caster", comme tu l'as fait, ou avec un (float)$row[2]; par exemple.

Voir 40 message(s) de cette discussion en une page