Javascript et php

**dianroca** · 15/07/2010, 23h54

Php et Javascript
dianroca - 15 jui 2010 à 23:48
Modifier
Bonjour,
J'ai rencontré un problème dans un code de programmation web. En effet je dois recuperer des données (php) à partir d'une base msql et les afficher defaçon de graphiques(courbe, histogramme ect...) en utilisant le plugin flot de jquery. Après avoir recuperer mes données,je les utlises dans mon code javascript qui est sensé afficher les graphes après une action click sur le bouton d'affichage. J'utilise un div comme espace où mon graphe sera créer.Cependant j'arrive pas à faire marcher le div dans mon code javascript. En gros mes courbes ne sont pas affichées pour l'instant

Mon code est le suivant:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<title>Code php : echo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script language="javascript" type="text/javascript" src="jquery.js"></script>
<script language="javascript" type="text/javascript" src="jquery.flot.js"></script>
 
 
 
 
</head>
 
<body>
<h2>Affichage Graphique</h2>
 
<div id="placeGraphe" style="width:800px;height:400px"></div>
 
<p>
<?php
 
$host="localhost:3308";
$login="";
$mp="";
$nom="stage";
try
{
$base=new PDO("mysql:host=localhost:3308;dbname=stage", "", "");
 
}
catch(Exception $e)
{
die('Erreur: ' .$e->getMessage());
 
}
 
//$rep=$base.query('select * from concept where idCpt <100');
 
$heure=$base->query('select heure_legale from lorient_1h_brut');
 
$debit=$base->query('select DUPLEIX_QTH_Debit_Traite_1h__A_ from lorient_1h_brut');
 
$str_date="new Array(\"0\"";
$str_deb="new Array(\"0\"";
while($data2=$heure->fetch())
{
//echo $data2['heure_legale'];
$date[]=$data2['heure_legale'];//tableau 1
$str_date.=",\"".$data2['heure_legale']."\"";
}
 
$heure->closeCursor();
 
while($data3=$debit->fetch())
{
$deb[]=$data3['DUPLEIX_QTH_Debit_Traite_1h__A_']; //tableau 2
$str_deb.=",\"".$data3['DUPLEIX_QTH_Debit_Traite_1h__A_']."\"";
}
$str_deb.=")";
$str_date.=")";
//echo "\n".$str_date."\n";
//echo "\n".$str_deb."\n";
 
$debit->closeCursor();
$taillex=count($date);
$tailley=count($deb);
//echo $taillex;
 
//echo $tailley;
 
?>
 
<script id="source" language="javascript" type="text/javascript">
(function grapher(deb, date, taillex,placeGraphe) {
//date[]; //Tableau des x du code php
//deb[]; //Tableau des y du code php
//taillex ;//taille su tableau date
//alert("salut");
for (var i = 0; i < taillex; i++)
//alert(i);
//alert(date[i]);
d1.push([date[i], deb[i]]); //push permet de créer des points à partir de coordonnées
 
$.plot($("#placeGraphe"), [ // plot permet d'afficher les courbes
{
data: d1,
lines: { show: true, fill: true }
}
]
 
});
</script>
<input type='button' value='cliquer' onclick='javascript:grapher(<?php echo $str_deb; ?>,<?php echo $str_date; ?>,<?php echo $taillex; ?>);' />
 
 
</p>
 
 
 
</body>
</html>

Si quelqu'un à une idée là dessus elle sera la bienvenue.

**tusssss** · 16/07/2010, 10h21

Le passage du php au javascript de tes éléments date et deb est un peu complexe... As tu essayé de poser des alert dasn ton javascript pour voir si tu récupérais bien tes données?

Des choses comme :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

alert (deb[i]);alert (date[i]);

Une fois que tu as vérifié ça, le problème viendra au choix de ton push ou de ton plot(et dans ce cas là, il faut lire la doc de la fonction plot de jQuery, si elle existe)

Bon courage.

**dianroca** · 16/07/2010, 10h31

Je reçois bien les données récupérées dans date et deb avec des alert. Pour les fonctions push et plot, elles marchent bien car je les ai testé avec un code html et javascrip (sans php) en créant mes points.Je pense que le problème viens de l'appel de la balise div dans le code javascript mais je ne sais pas comment le résoudre.

Merci

**emmanuel.remy** · 16/07/2010, 10h45

Salut,

Soit je ne suis pas bien réveillé, soit ton code javascript manque de parenthèses, accolades, etc...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
(function grapher(deb, date, taillex,placeGraphe) {
    for (var i = 0; i < taillex; i++)
         d1.push([date[i], deb[i]]); 
    $.plot( $("#placeGraphe"), [
         {
           data: d1,
           lines: { show: true, fill: true }
         }
       ]
 
}
);

ERE

**dianroca** · 16/07/2010, 10h56

Oui il manquait une parenthèse fermante après la fonction plot. Je l'ai corrigé mais apparemment le problème ne se situe pas là bas.

**emmanuel.remy** · 16/07/2010, 11h31

Ok.

Maintenant, pourquoi ta fonction est entre parenthèses ? Tu crées ainsi un contexte qui fait qu'elle ne peut pas être appelée. Donc la question est: comment fais tu pour l'appeler ?

ERE

**dianroca** · 16/07/2010, 16h32

Les parenthèses ne servent à rien.Je les ai enlevé et ça marche maintenant. Je ne sais pas si quelqu'un s'y connait en flot(le plugin de jquery)?

**emmanuel.remy** · 16/07/2010, 18h28

Envoyé par dianroca

Les parenthèses ne servent à rien.Je les ai enlevé et ça marche maintenant. Je ne sais pas si quelqu'un s'y connait en flot(le plugin de jquery)?

Moi non plus, mais si tu as un souci avec ce plugin, va voir du côté du forum jQuery.

ERE

**devyan** · 18/07/2010, 21h04

Bonjour,

Je crois que le soucis vient du fait que tu "penses" recevoir 2 tableaux alors que tu a 2 chaînes dans ton code javascript il me semble...

Les paramètres de la fonction grapher(date, deb, ...) reçoivent $str_date et $str_deb

Essaye d'insérer quelque chose du genre :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
var tabdate = date.split('\');
var tabdeb = deb.split('\');

ensuite utilises tabdate[i] et tabdeb[i] à la place de date[i] et deb[i]

devyan

**Bovino** · 18/07/2010, 21h25

Envoyé par dianroca

Les parenthèses ne servent à rien.Je les ai enlevé et ça marche maintenant. Je ne sais pas si quelqu'un s'y connait en flot(le plugin de jquery)?

Tu peux toujours regarder : Visualisation professionnelle de vos données avec Flot et jQuery

Javascript et php

JavaScript

Discussions similaires

Partager

Partager