Categories: GraficaPHP

Grafici Dinamici in PHP

Qualche mese fa avevamo introdotto il disegno di semplici forme, in particolare avevamo visto un cerchio, utilizzando le librerie grafiche GD di PHP, in questo nuovo articolo vedremo come sfruttare queste conoscenze per realizzare un semplice grafico dinamico prelevando i dati da una tabella MySQL.
Innanzitutto dobbiamo creare il database che andrà ad ospitare i nostri dati, una tabella molto semplice con i punti del grafico, possiamo inserire un campo x ed un campo y di tipo intero. Ora non ci resta che preparare il form per far inserire i dati al nostro utilizzatore, dobbiamo anche porre dei limiti, diciamo 400 punti in ascissa ed altrettanto in ordinata.

<?php

  // Raccolgo i dati
  $sX = $_REQUEST['x'];
  $sY = $_REQUEST['y'];

  $nError = 0;
  if (strlen($sX) > 0 && strlen($sY) > 0)
  {
     if ($sX >= 0 && $sY >= 0)
     {
 if ($sX <= 400 && $sY <= 400)
 {
    // Apro la connessione alla tabella punti
                nel database grafico ed inserisco i valori
           $my_server = mysql_connect("localhost", "root", "")
              or trigger_error(mysql_error(),E_USER_ERROR);
    mysql_select_db("grafico", $my_server);
    $query = "INSERT INTO punti (x, y) VALUES($sX, $sY)";
    mysql_query($query, $my_server) or die(mysql_error());
    mysql_close($my_server);
 }
 else
    $nError = 2;
     }
     else
 $nError = 1;
  }

?>

<html>
<head><title>Un Grafico Dinamico</title></head>

<body bgcolor="#C0C0C0">

   <h1 align="center"
       style="color:#444444;font-family:trebuchet,Tahoma,
       Verdana;font-size:14px;font-weight:bold">
 Un Grafico Dinamico con le Librerie GD
   </h1>

<?php

 if ($nError > 0)
    echo '<p align="center"
              style="color:#E70000;font-family:trebuchet,
              Tahoma,Verdana;font-size:14px;font-weight:normal">';

 switch ($nError)
 {
 case 1:
    echo 'I valori dei punti devono essere superiori
                a zero!';
    break;
 case 2:
    echo 'I valori dei punti devono essere inferiori
                a 400!';
    break;
 }

 if ($nError > 0)
  echo '</p>';

?>

 <div align="center"><img src="piano.php"></div>

 <br>

 <form action="#" method="POST" name="punti">
 <table width="800" border="0" align="center"
           cellpadding="0" cellspacing="0"
             style="border: 1px solid #666666">
 <tr>
    <td width="400" height="100" align="center"
                valign="middle">
    <label>Inserire l'ascissa:
    <input type="text" name="x" value="0"
              title="Inserire l'ascissa del punto">
    </td>
    <td width="400" height="100" align="center"
              valign="middle">
    <label>Inserire l'ordinata:
    <input type="text" name="y" value="0"
             title="Inserire l'ordinata del punto">
    </td>
 </tr>
 <tr>
    <td height="100" colspan="2" align="center"
               valign="middle">
    <input type="submit" name="invia"
              title="Click qui per inviare i valori"
                   value="Memorizza">
    </td>
 </tr>
 </table>
 </form>

</body>

</html>

Questo sopra è il codice della pagina che richiama l’immagine GD, si nota come all’inizio prendo i dati delle variabili e quando ho più di un punto comincio a disegnare le rette, come è possibile evincere dal codice della pagina del disegno.

<?php

 // Apro la connessione dati per prelevare i dati
 $my_server = mysql_connect("localhost", "root", "") or
            trigger_error(mysql_error(),E_USER_ERROR);
 mysql_select_db("grafico", $my_server);
 $query = "SELECT * FROM punti";
 $my_punti = mysql_query($query, $my_server) or
            die(mysql_error());
 $row_punti = mysql_fetch_assoc($my_punti);
 $num_punti = mysql_num_rows($my_punti);

 // Preparo per il disegno
 $img = imagecreate(400, 400);
 $clr_sfondo = imagecolorallocate($img, 192, 192, 192);
 imagefill($img, 0, 0, $clr_sfondo);
 $clr_linea = imagecolorallocate($img, 0, 0, 0);

 // Disegno i punti e li collego
 for ($i = 1; $i < $num_punti; $i++)
 {
  $x0 = $row_punti['x'];
  $y0 = $row_punti['y'];

  $row_punti = mysql_fetch_assoc($my_punti);

  $x = $row_punti['x'];
  $y = $row_punti['y'];

  imageline($img, $x0, $y0, $x, $y, $clr_linea);
 }

 mysql_free_result($my_punti);
 mysql_close($my_server);
 imagepng($img);
 imagedestroy($img);

?>

Questo sopra è il codice della pagina che ho chiamato “piano.php” che è quella che disegna l’immagine con le librerie GD. Se avete seguito i miei articoli passati potrete notare come sia semplice creare dei grafici dinamici in PHP. Da ora potrete esercitarvi ed anche sbizzarrirvi con la creazione di disegni che provengono da dati che risiedono su un database MySQL. Come sempre io vi fornisco i mattoni e poi voi con curiosità e voglia di sperimentare fate il resto.