[JpGraph] Intégration JpGraph dans page web autres questions

**Anju44** · 02/06/2014, 18h00

Bonjour

J'aurai plusieurs questions à vous poser ! Donc déjà, voici ma situation : j'ai créé une liste déroulante me permettant de récupérer les imprimantes répertoriées dans ma base de données. Le voici :

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
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<title>Liste déroulante</title>
	</head>
 
	<body>
		<form action="graph_histo_impr_copie.php" method="POST">
			<table>
				<tr>
					<td>
						<?php
						// Connexion à MySQL
						mysql_connect("localhost", "root", "a" );
						mysql_select_db("imprimantes_test" );
 
						// Requête sur la table choisie
						$reponse = mysql_query("SELECT * FROM imprimantes" );
 
						echo'<select name="imprimante">';
 
						while ($donnees = mysql_fetch_array($reponse))
						{
						?>
 
						<option value="<?php echo $donnees['id_imprimante']; ?>"><?php echo $donnees['nom_imprimante']; ?></option>
 
						<?php
						}
 
						echo'</select>';
 
						// Déconnexion de la base
						mysql_close();
						?>
					</td>
				</tr>
				<tr>
					<td>
						<input type="submit" value="Afficher le graphique" />
					</td>
				</tr>
			</table>
		</form>	
 
	</body>
</html>

Puis, depuis cette liste déroulante, lorsque je choisis une imprimante, et que je clique sur le bouton, cela m'affiche mon graphique. Voici le code (ne faites pas attention, certains commentaires sont des essais de ma part) :

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
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
<?php
 
include ("../jpgraph/src/jpgraph.php");
include ("../jpgraph/src/jpgraph_bar.php");
 
define('MYSQL_HOST', 'localhost');
define('MYSQL_USER', 'root');
define('MYSQL_PASS', 'a');
define('MYSQL_DATABASE', 'imprimantes_test');
 
$tableauDate = array();
$tableauCompteurs = array();
 
// ************************************************
// Extraction des données dans la base de données *
// ************************************************
 
$id_impr = $_POST['imprimante'];
 
$sql = <<<EOF
	SELECT	compteur AS COMPT,
		date_releve AS JOUR
	FROM compteurs
	WHERE id_imprimante = '$id_impr'
	ORDER BY date_releve DESC
	LIMIT 0,30
EOF;
 
/*$nom = <<<EOF
	SELECT nom_imprimante,
	FROM imprimantes
EOF;*/
 
$mysqlCnx = @mysql_connect(MYSQL_HOST, MYSQL_USER, MYSQL_PASS) or die('Problème de connexion mysql');
 
@mysql_select_db(MYSQL_DATABASE) or die('Problème de sélection de la base');
 
$mysqlQuery = @mysql_query($sql, $mysqlCnx) or die('Problème de requête');
 
//$nom_impr = @mysql_query($nom, $mysqlCnx) or die('Problème de requête');
 
//echo $nom_impr;
 
while ($row = mysql_fetch_array($mysqlQuery,  MYSQL_ASSOC)) 
{
	$tableauDate[] = ' ' . $row['JOUR'];
	$tableauCompteurs[] = $row['COMPT'];
	$i++;
}
 
// Calcul de la différence entre les compteurs
$i = 1;
$j = array();
while ($i < (count($tableauCompteurs)-1))
{
	$j[$i] = $tableauCompteurs[$i] - $tableauCompteurs[$i+1];
	$i++;
}
 
 
 
// ***********************
// Création du graphique *
// ***********************
 
 
// Construction du conteneur
// Spécification largeur et hauteur
$graph = new Graph(800,500);
 
// Réprésentation linéaire
$graph->SetScale("textlin");
 
// Ajouter une ombre au conteneur
$graph->SetShadow();
 
// Fixer les marges
$graph->img->SetMargin(40,30,25,100); // Gauche, droit, haut, bas
 
// Création du graphique histogramme
$bplot = new BarPlot($j);
 
// Spécification des couleurs des barres
//$bplot->SetFillColor(array('red'));
$bplot->SetFillGradient('#088A08', '#F5FBEF', GRAD_LEFT_REFLECTION);
 
// Une ombre pour chaque barre
$bplot->SetShadow();
 
// Afficher les valeurs pour chaque barre
$bplot->value->Show();
 
// Fixer l'aspect de la police
$bplot->value->SetFont(FF_ARIAL,FS_NORMAL,9);
 
// Modifier le rendu de chaque valeur
//$bplot->value->SetFormat('%d ventes');
 
// Ajouter les barres au conteneur
$graph->Add($bplot);
 
// Le titre
$graph->title->Set("Compteurs de l'imprimante");
$graph->title->SetFont(FF_FONT1,FS_BOLD);
 
// Titre pour l'axe horizontal(axe x) et vertical (axe y)
$graph->xaxis->title->Set("Date");
$graph->yaxis->title->Set("Impressions par jour");
 
$graph->yaxis->title->SetFont(FF_FONT1,FS_BOLD);
$graph->xaxis->title->SetFont(FF_FONT1,FS_BOLD);
 
// Légende pour l'axe horizontal
$graph->xaxis->SetTickLabels($tableauDate);
$graph->xaxis->SetLabelAngle(45); // Change l'inclinaison de la date
 
 
// Afficher le graphique
$graph->Stroke();
 
?>

Et voici ce que ça me donne (en exemple) :

Nom : graphique.jpg
Affichages : 348
Taille : 65,1 Ko

J'ai donc plusieurs questions, que voici :

Je voudrais afficher dans le titre de mon graphique, le nom de l'imprimante sélectionnée dans la liste déroulante. Je me doute qu'il faut le mettre dans une variable, j'ai fais des tests avec une requête (ce qu'on peut voir en commentaire), mais je n'arrive pas à intégrer le nom de mon imprimante choisie dans ma variable...
Je souhaiterai modifier le format date de mon graphique. Pour le moment il est en format américain, et j'aimerai pouvoir le mettre en format français. Comment faire cela facilement ? De la même façon, j'aimerai pouvoir "retourner" mon graphique. Il se lit de droite à gauche, et j'aimerai qu'il se lise de gauche à droite.
Mon graphique affiche le nombre d'impression qu'il y a eu en une journée. Je souhaiterai qu'au dessus de chaque barre s'inscrive la valeur qu'elle représente. Est-ce possible ? Si oui, comment faire ?
Enfin, je souhaiterai que tout ceci se trouve sur une seule page web. Avec, par exemple, la liste déroulante à gauche, et que lorsque je choisis mon imprimante, le graphique apparaisse dans un cadre au centre du site. Pour le moment, je n'arrive pas à le faire sur la même page, il m'ouvre une nouvelle page à chaque fois.
Petit bonus (plus en rapport avec le HTML/CSS): y'a-t-il possibilité de modifier l'apparence de la liste déroulante pour qu'elle apparaisse façon "menu" ?

Voilà, ce sera tout xD
J'ai bien conscience que je demande beaucoup de choses, et j'en suis désolée, mais je débute avec JpGraph et j'ai encore du mal à bien m'en servir...

Je vous remercie donc d'avance pour l'aide que vous pourrez me fournir !

Ju'

**sabotage** · 02/06/2014, 20h10

1 - ta requête renvoir toutes les imprimantes, il manque un critère WHERE

2 - ce n'est pas un format americain. sinon tout est dans la doc :
http://jpgraph.net/download/manuals/...l/ch14s10.html

3 - il semble que le Show() doivent être après le Add()

Code :

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

1
2
$graph->Add($bplot);
$bplot->value->Show();

4 -Tu fais pointer ton formulaire sur lui même et tu appelles l'image dedans :

Code :

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

1
2
3
if (isset($_POST['imprimante'])) {
  echo '<img src="graph_histo_impr_copie.php?imprimante=' . $_POST['imprimante'] . '" />';
}

evidemment dans graph_histo_impr_copie.php tu utilises $_GET au lieu de $_POST

5 - c'est pas la bon endroit et c'est quoi "façon menu" ?

**Anju44** · 03/06/2014, 09h33

1. J'ai fais ceci :

Code :

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

1
2
3
4
5
6
7
8
9
$id_impr = $_GET['imprimante'];
 
$nom = <<<EOF
	SELECT nom_imprimante
	FROM imprimantes
	WHERE id_imprimante = '$id_impr'
EOF;
 
$nom_impr = @mysql_query($nom, $mysqlCnx) or die('Problème de requête');

Et ceci pour l'appeler :

Code :

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

$graph->title->Set("Compteurs de l'imprimante" + $nom_impr);

Mais il m'affiche seulement "26" pour toutes les imprimantes, sans même écrire "Compteurs de l'imprimante"

2. Je vais voir ça du coup ^^

3. Ça fonctionne !

Par contre, il me l'affiche en décimal (36.0 par exemple), comment retirer la virgule ? :o

4. Ça fonctionne également

J'arrive à l'afficher directement sur le site c'est super ^^

5. Oui je me doutais que c'était pas le bon endroit. C'est pas grave, je trouverai une façon de faire ^^
(Et par "menu", je pensais à une sorte de menu déroulant qui prendrait les données de la liste. Ou directement transformer la liste en menu déroulant qui prendrait directement les données dans la base...)

Merci beaucoup pour ta réponse Sabotage ! Tu vas finir par en avoir marre de moi à force

Mais je te remercie pour ta patience et ton aide !

**sabotage** · 03/06/2014, 11h21

mysql_query ne renvoit pas la valeur. Il faut un "fetch".

Code :

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

1
2
3
$result = mysql_query($nom, $mysqlCnx);
$row = mysql_fetch_assoc($result);
$nom_impr = $row['nom_imprimante'];

Pour ton menu, il faut que tu decides la forme HTML/CSS/Javascript que tu veux et le faire ecrire par PHP exactement de la meme façon que tu construis ton select actuellement.

**Anju44** · 03/06/2014, 11h30

Cela ne fonctionne pas, ça m'affiche "0" maintenant :/

Je te remets mon code, j'ai sûrement fais une erreur quelque part...

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
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
<?php
 
include ("../jpgraph/src/jpgraph.php");
include ("../jpgraph/src/jpgraph_bar.php");
 
define('MYSQL_HOST', 'localhost');
define('MYSQL_USER', 'root');
define('MYSQL_PASS', 'a');
define('MYSQL_DATABASE', 'imprimantes_test');
 
$tableauDate = array();
$tableauCompteurs = array();
 
// ************************************************
// Extraction des données dans la base de données *
// ************************************************
 
$id_impr = $_GET['imprimante'];
 
$sql = <<<EOF
	SELECT	compteur AS COMPT,
		date_releve AS JOUR
	FROM compteurs
	WHERE id_imprimante = '$id_impr'
	ORDER BY date_releve DESC
	LIMIT 0,30
EOF;
 
$nom = <<<EOF
	SELECT nom_imprimante
	FROM imprimantes
	WHERE id_imprimante = '$id_impr'
EOF;
 
$mysqlCnx = @mysql_connect(MYSQL_HOST, MYSQL_USER, MYSQL_PASS) or die('Problème de connexion mysql');
 
@mysql_select_db(MYSQL_DATABASE) or die('Problème de sélection de la base');
 
$mysqlQuery = @mysql_query($sql, $mysqlCnx) or die('Problème de requête');
 
$result = mysql_query($nom, $mysqlCnx) or die('Problème de requête');
$result2 = mysql_fetch_assoc($result);
$nom_impr = $result2['nom_imprimante'];
 
//echo $nom_impr;
 
while ($row = mysql_fetch_array($mysqlQuery,  MYSQL_ASSOC)) 
{
	$tableauDate[] = ' ' . $row['JOUR'];
	$tableauCompteurs[] = $row['COMPT'];
	$i++;
}
 
// Calcul de la différence entre les compteurs
$i = 1;
$j = array();
while ($i < (count($tableauCompteurs)-1))
{
	$j[$i] = $tableauCompteurs[$i] - $tableauCompteurs[$i+1];
	$i++;
}
 
 
// ***********************
// Création du graphique *
// ***********************
 
 
// Construction du conteneur
// Spécification largeur et hauteur
$graph = new Graph(800,500);
 
// Réprésentation linéaire
$graph->SetScale("textlin");
 
// Ajouter une ombre au conteneur
$graph->SetShadow();
 
// Fixer les marges
$graph->img->SetMargin(50,30,50,100); // Gauche, droit, haut, bas
 
// Création du graphique histogramme
$bplot = new BarPlot($j);
 
// Spécification des couleurs des barres
$bplot->SetFillGradient('#088A08', '#F5FBEF', GRAD_LEFT_REFLECTION);
 
// Une ombre pour chaque barre
$bplot->SetShadow();
 
// Fixer l'aspect de la police
$bplot->value->SetFont(FF_ARIAL,FS_NORMAL,9);
 
// Ajouter les barres au conteneur
$graph->Add($bplot);
 
// Afficher les valeurs pour chaque barre
$bplot->value->Show();
 
// Le titre
$graph->title->Set("Compteurs de l'imprimante" + $nom_impr);
$graph->title->SetFont(FF_FONT1,FS_BOLD);
 
// Titre pour l'axe horizontal(axe x) et vertical (axe y)
$graph->xaxis->title->Set("Date");
$graph->yaxis->title->Set("Impressions par jour");
 
$graph->yaxis->title->SetFont(FF_FONT1,FS_BOLD);
$graph->xaxis->title->SetFont(FF_FONT1,FS_BOLD);
 
// Légende pour l'axe horizontal
$graph->xaxis->SetTickLabels($tableauDate);
$graph->xaxis->SetLabelAngle(45); // Change l'inclinaison de la date
 
 
// Afficher le graphique
$graph->Stroke();
 
?>

**sabotage** · 03/06/2014, 11h54

En PHP c'est . la concatenation

Code :

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

$graph->title->Set("Compteurs de l'imprimante" . $nom_impr);

**Anju44** · 03/06/2014, 13h09

Aaaah super ! Merci

Du coup, pour en revenir à ma question n°2, est-il possible de "retourner" le graphique pour qu'on puisse le lire de gauche à droite ?
Et est-il possible d'ajouter à mon formulaire une option pour que l'on puisse choisir un intervalle de dates à afficher ? Voir un certain nombre de dates ?

Et dernier petit détail, comment puis-je faire en sorte qu'il enlève les décimales sur les valeurs ?

**ypcman** · 03/06/2014, 19h22

Bonjour.
Pas de décimales :

Code php :

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

$bplot->value->SetFormat('%d');

"Retourner" le graphique n'est pas clair ... veux-tu inverser l'ordre des barres ou autre chose ?

Yves.

**Anju44** · 03/06/2014, 20h28

Merci pour les décimales

Et bien, là quand on regarde les dates, on les lit de droite à gauche. Moi j'aimerai qu'on les lise de gauche à droite

**ypcman** · 03/06/2014, 21h28

Si tu veux inverser l'ordre des barres, ce n'est pas du jpgraph mais du php tout simple : utilise la fonction array_reverse() pour $j et pour $tableauDate

**Anju44** · 04/06/2014, 09h52

D'accord merci !

Peux-tu juste me dire à quel moment je dois les mettre ?
Car je les ai mis juste après ma boucle qui calcule la différence des compteurs, et mes graphiques ne s'affichent plus du tout :/

**ypcman** · 04/06/2014, 10h01

Code php :

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

1
2
3
4
5
6
7
8
9
10
 
$tableauDate=array();
$tableauDate_reversed=array();
while ($row = mysql_fetch_array($mysqlQuery,  MYSQL_ASSOC)) 
{
	$tableauDate[] = ' ' . $row['JOUR'];
	$tableauCompteurs[] = $row['COMPT'];
	$i++;
}
$tableauDate_reversed=array_reverse($tableauDate);

Code php :

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

1
2
3
4
5
6
7
8
9
10
 
$j = array();
$j_reversed = array();
 
while ($i < (count($tableauCompteurs)-1))
{
	$j[$i] = $tableauCompteurs[$i] - $tableauCompteurs[$i+1];
	$i++;
}
$j_reversed =array_reverse($j);

**Anju44** · 04/06/2014, 10h18

Merci !

Je m'apprêtais à dire que ça ne fonctionnait pas, jusqu'à ce que je pense à changer les variables dans le graphique xD

Du coup, tout fonctionne parfaitement, j'ai pu enlever les décimales également

Merci beaucoup, vraiment !

Je passe le sujet en résolu

Encore merci à vous pour votre aide !

**Anju44** · 04/06/2014, 16h28

Désolée, je reviens vite fait sur ce sujet, par rapport à une question restée sans réponse

Est-il possible d'ajouter à mon formulaire une option pour que l'on puisse choisir un intervalle de dates à afficher sur le graphique ? Voir un certain nombre de dates ?

**ypcman** · 05/06/2014, 15h08

Oui c'est tout à fait faisable mais ça n'a rien à voir avec la librairie JpGraph
Une simple recherche sur le forum php "formulaire dates" devrait de donner des éléments de réponse voir des scripts tout fait

**Anju44** · 06/06/2014, 14h05

Je dois être nulle en recherche, car je n'en ai pas trouvé ^^'
En aurais-tu un à me proposer ? Ou plusieurs ?

**ypcman** · 06/06/2014, 15h01

Tu n'as pas du beaucoup chercher ... dans Google 'php formulaire dates' donne de nombreux liens :

Tu peux essayer le type date.
Ou utiliser Java script.
Ou en php : http://www.developpez.net/forums/d22...-d-formulaire/

**Anju44** · 06/06/2014, 15h07

Je dois avouer que je n'ai cherché que sur le forum PHP de developpez.net xD

Je vais regarder tes liens, merci beaucoup !
Je ne t'embête plus

Encore merci pour ton aide !
Bonne continuation !
Ju'

[JpGraph] Intégration JpGraph dans page web autres questions

Bibliothèques et frameworks PHP

Discussions similaires

Partager

Partager