[AJAX] Importer un jpgraph via ajax
Salut,
Bon voila je voudrai savoir comment faire pour aller chercher un jpGraph via ajax. Voici le code pour générer mon graphe, la page reçoit par url un code correspondant à la table à la quelle elle doit tirer les valeur pour les tracer:
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 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
| <?php
include_once ("jpgraph.php");
include_once ("jpgraph_line.php");
define('MYSQL_HOST', 'localhost');
define('MYSQL_USER', 'root');
define('MYSQL_PASS', '3135');
define('MYSQL_DATABASE', 'site');
$Id = array();
// *********************
// Production de données
// *********************
$RFID=$_GET['RFID'];
$sql_tension = <<<EOF
(SELECT
tension AS TENSIONS,
N AS MESURE
FROM $RFID )ORDER BY N DESC LIMIT 10
EOF;
$mysqlCnx = @mysql_connect(MYSQL_HOST, MYSQL_USER, MYSQL_PASS) or die('Pb de connxion mysql');
@mysql_select_db(MYSQL_DATABASE) or die('Pb de sélection de la base');
$mysqlQuery = @mysql_query($sql_tension, $mysqlCnx) or die('Pb de requête');
while ($row_tension = mysql_fetch_array($mysqlQuery, MYSQL_ASSOC)) {
$tableauTension[] = $row_tension['TENSIONS'];
}
$inv=array_reverse($tableauTension);
// ***********************
// Création du graphique
// ***********************
// Création du conteneur
$graph = new Graph(500,300);
// Fixer les marges
$graph->img->SetMargin(40,30,50,40);
// Mettre une image en fond
//$graph->SetBackgroundImage("images/mael_white.png",BGIMG_FILLFRAME);
// Lissage sur fond blanc (évite la pixellisation)
$graph->img->SetAntiAliasing("white");
// A détailler
$graph->SetScale("textlin");
// Ajouter le titre du graphique
$graph->title->Set("Evolution de la tension");
// Afficher la grille de l'axe des ordonnées
$graph->ygrid->Show();
// Fixer la couleur de l'axe (bleu avec transparence : @0.7)
$graph->ygrid->SetColor('blue@0.7');
// Des tirets pour les lignes
$graph->ygrid->SetLineStyle('dashed');
// Afficher la grille de l'axe des abscisses
$graph->xgrid->Show();
// Fixer la couleur de l'axe (rouge avec transparence : @0.7)
$graph->xgrid->SetColor('red@0.7');
// Des tirets pour les lignes
$graph->xgrid->SetLineStyle('dashed');
// Apparence de la police
$graph->title->SetFont(FF_ARIAL,FS_BOLD,11);
// Créer une courbes
$courbe = new LinePlot($inv);
// Afficher les valeurs pour chaque point
$courbe->value->Show();
// Valeurs: Apparence de la police
$courbe->value->SetFont(FF_ARIAL,FS_NORMAL,9);
$courbe->value->SetFormat('%0.1f');
$courbe->value->SetColor("blue");
// Chaque point de la courbe ****
// Type de point
$courbe->mark->SetType(MARK_FILLEDCIRCLE);
// Couleur de remplissage
$courbe->mark->SetFillColor("pink");
// Taille
$courbe->mark->SetWidth(4);
// Couleur de la courbe
$courbe->SetColor("blue");
$courbe->SetCenter();
// Paramétrage des axes
$graph->xaxis->title->Set("Mesure");
$graph->yaxis->title->SetFont(FF_FONT1,FS_BOLD);
$graph->xaxis->title->SetFont(FF_FONT1,FS_BOLD);
$graph->xaxis->SetTickLabels($Id);
// Ajouter la courbe au conteneur
$graph->Add($courbe);
$graph->Stroke();
?> |
et voici un code ajax dont j'ai l'habitude de traivailler avec " je débute dans ajax ":
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
| <script language="javascript" type="text/javascript">
//Browser Support Code
function FonctionGrapheTension(){
var ajaxRequest; // The variable that makes Ajax possible!
try{
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
}
catch (e){
// Internet Explorer Browsers
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e){
// Something went wrong
alert("Your browser broke!");
return false;
}
}
}
// Create a function that will receive data sent from the server
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
//document.myForm.time.value = ajaxRequest.responseText;
var ajaxDisplay = document.getElementById('AffichageGrapheTension');//ici in emplacement ou j'affiche mon graphe
ajaxDisplay.innerHTML = ajaxRequest.responseText;
}
}
var rfid=1234;
var queryString = "?RFID=" + rfid;
ajaxRequest.open("GET", "medecin_graphe_tension_ajax.php" + queryString, true);
ajaxRequest.send(null);
setTimeout(FonctionGrapheTension,100);
}
</script> |
comment pourrais-je le modifier pour pouvoir afficher mon graphe.
Sinon est ce que quel qu'un pourrait me donner une solution pour rendre le graphe dynamique dans ma page.
REMERCIEMENTS...