| |
Les fonctions graphiques de PHP
Comment, mieux qu'à l'aide d'un graphique lié, peut-on
illustrer un tableau issu d'une base de données, un résultat
de sondage, etc. ? Nous nous proposons de mettre en œuvre ici
quelques unes des fonction de php qui le permettent.
Créer une première image
nous allons créer un fichier "dessin.php3" sur
le serveur de free. Cet hébergeur offre en effet gratuitement
le support php aux webmestres qui y ont un compte.
Rappel : Les noms de fonctions en PHP ne sont pas "case-sensitives".
Les commentaires PHP sont précédés par deux
traits obliques ou bien encadrés par /*....*/.
<?
/* comme nous souhaitons générer un flux qui sera
expédiédirectement au Browser nous utilisons la
fonction header() pour créer un en-tête HTTP sous
la forme d'une chaîne de caractère. Attention : cette
fonction un peu spéciale DOIT être placée
AVANT tout contenu dans le document. */
header("content-type: image/gif");
/* pour des raisons de licence (gif n'est pas un format
libre), les dernières versions de php ne peuvent créer
que des image au formatPng. Notre en-tête de fichier image
devrait alors être rédigé ainsi : content-type:
image/png. */
$monImage = imageCreate(200,100);
/* La fonction imageCreate crée ici une image blanche,
de largeur 200 et de hauteur 100 pixels. Cette fonction retourne
un identifiant, information requise pour toutes nos opérations
à venir. */
/* imagecolorallocate() permet de définir une couleur en
RVB, Cette fonction doit être appelée pour créer
chaque couleur qu'utilisera notre image. Ici nous stockons ces
couleurs dans autant de variables */
$noir = imageColorAllocate($monImage, 0,0,0);
$jaune = imageColorAllocate($monImage, 255,255,0);
$vert = imageColorAllocate($monImage, 0,255,0);
$rouge = imageColorAllocate($monImage, 255,0,0);
$bleu = imageColorAllocate($monImage, 0,0,255);
$gris = imageColorAllocate($monImage, 128,128,128);
$blanc = imageColorAllocate($monImage, 255,255,255);
// nous pouvons dés lors remplir notre rectangle par :
imageFill($monImage, 0, 0, $gris);
/* cette fonction comme beaucoup d'autre on va le voir peut être
assimilée à l'outil pot de peinture de nombreux
logiciel. Il s'agit ici de remplir toute une surface de pixels
contigus et monochrome à partir d'un point passé
en paramètres. Dans le cas qui nous intéresse ici
les coordonnées de départ du remplissage importent
peu !
à l'intérieur de notre image nous souhaitons maintenant
dessiner un rectangle évidé et deux traits obliques.
Pour le rectangle nous passons à la fonction imageRectangle()
les coordonnées gauche, haute, droite et basse du rectangle
intérieur. Ces coordonnées sont notées depuis
l'angle supérieur gauche de l'image */
imageRectangle($monImage, 20,10,180,90, $blanc );
// on tire les deux traits blancs. Il faut cette fois passer
quatre coordonnées marquant deux à deux les points
de départ et d'arrivée du trait :
imageLine($monImage, 0,0,200,100, $blanc );
imageLine($monImage, 0,100,200,0, $blanc );
/* et si nous voulons voir dès lors le résultat
? La fonction imageGif($monImage, "nomDeFichier.gif")
crée un fichier image Dans le répertoire courant
du serveur.
Si l'image n'a pas de couleur transparente (définie par
imagecolortransparent()) son format sera GIF87. GIF89 dans l'autre
cas. Maintenant si l'on ne passe aucun nom de fichier en argument,
aucun fichier ne sera crée sur le serveur mais sera transmis
directement à la sortie standard. Parce que nous avons
fait usage de la fonction header()), nous pouvons exploiter cette
possibilité :*/
imageGif($monImage); // PHP 4 : imagePng($monImage)
/* et libérer la mémoire de l'image créée
par :
imageDestroy($monImage);
?>
Pour voir notre image, on télécharge en ftp notre
fichier sur le serveur de free à coté du document
HTML d'appel. Dans le browser on saisit son adresse. http://moi.free.fr/dessin.php3
Plus traditionnellement pour faire apparaître notre images
dans la page HTML nous utiliserions la balise IMG ainsi rédigée
:
<IMG SRC="dessin.php3">
Aller plus loin
Notre image en l'état n'est certes pas très intéressante.
Nous voulons obtenir un bouton et y faire apparaître le texte
de notre choix. Nous savons que si nous appelons le fichier php
ainsi :
<IMG SRC="dessin.php3?leTexte='Clic' ">
Le serveur créera automatiquement la variable globale $leTexte
et la mettra à la disposition de notre script. Nous reprenons
donc "dessin.php3" et le modifions ainsi :
header("content-type: image/gif");
$monImage = imageCreate(200,100);
$noir = imageColorAllocate($monImage, 0,0,0);
$jaune = imageColorAllocate($monImage, 255,255,0);
$vert = imageColorAllocate($monImage, 0,255,0);
$rouge = imageColorAllocate($monImage, 255,0,0);
$bleu = imageColorAllocate($monImage, 0,0,255);
$gris = imageColorAllocate($monImage, 128,128,128);
$blanc = imageColorAllocate($monImage, 255,255,255);
imageFill($monImage, 0, 0, $bleu);
imageRectangle($monImage, 20,10,180,90, $blanc );
imageLine($monImage, 0,0,200,100, $blanc );
imageLine($monImage, 0,100,200,0, $blanc );
/* Nous allons remplir les bords de notre dessin. Encore une
fois il faut que nous imaginions utiliser un outil pot et cliquer
en un point précis de l'image pour remplir toutes les zones
contiguës jusqu'une certaine couleur : */
imagefillToBorder( $monImage , 100,5, $blanc, $gris );
/* traduction : remplit avec du gris toute la surface depuis
le point de coordonnées 100,5 (le milieu en haut), jusqu'aux
contours blancs */
imagefillToBorder( $monImage , 5,50, $blanc, $gris );
imagefillToBorder( $monImage , 100,95, $blanc, $noir );
imagefillToBorder( $monImage , 195,50, $blanc, $noir );
// voilà ce que cela donnerait à ce stade :
/* Pour placer un rectangle plein blanc par dessus, on doit passer
à la fonction imageFilledRectangle() quatre coordonnées
gauche, haute, droite et basse du rectangle :
imageFilledRectangle($monImage, 20,10,180,90, $blanc );
/* dessiner un cercle ou un ovale c'est passer en argument le
delta du centre (x ,y), une largeur, une hauteur, un angle de
début, un angle de fin (sens horaire) : */
imageArc( $monImage, 100,50,30,20, 0, 360, $rouge );
// on remplit tout de suite cet ovale en "cliquant"
au centre avec notre "outil pot" :
imagefillToBorder( $monImage , 100,50, $rouge, $jaune );
/* nous allons maintenant écrire dans notre jaune œuf,
précisément la chaîne passée en query
string. Rappel le serveur à créer automatiquement
la variable $leTexte et lui a donné la valeur "clic".
nous pouvons donc au lieu de coder "en dur" une chaîne
de caractères utiliser cette variable et la passer en argument
à la fonction imageString().*/
imageString($monImage, 5, 82, 42, $leTexte, $noir);
/* la fonction imageString() requiert en argument un entier indiquant
police et tailles devant être utilisées. Les valeurs
1,2,3,4,5 permettent de faire appel aux polices par défaut
du serveur. Il serait possible de charger d'autres polices avec
imageLoadFont() et d'utiliser la valeur numérique que retourne
cette fonction ici. Les deux autres entiers (82,42) marquent la
position du premier caractère du texte. Ici le placement
et "pifométrique" mais imagettfbbox() permettrait
de connaître l'espacement requis par une chaîne de
caractère à l'aide d'une police déterminée.
*/
// On créé le fichier image (ici de nouveau directement
sur la sortie standard et on libère la ram.
imageGif($monImage);
imageDestroy($monImage);
?>
Créer un graphique en camembert
S'il existe des fonctions comme imageFilledRectangle() ou imageFilledPolygon()
il n'est pas possible directement en revanche de remplir un arc
de cercle. Nous allons ici mettre en œuvre une astuce afin
de dessiner un camembert.
On crée d'abord un fichier "camembert.php3" qui
sera appelé dans notre document HTML par une balise image
standard. Nous passerons dans la requête les paramètres
angle de début de l'arc plein, angle fin et couleur.
<IMG SRC="camembert.php3?debut=0&fin=200&couleur=vert">
Afin de rendre cela possible, "camembert.php3 sera rédigé
ainsi :
<?
header("content-type: image/gif");
$monImage = imageCreate(300,300);
$noir = imageColorAllocate($monImage, 0,0,0);
$jaune = imageColorAllocate($monImage, 255,255,0);
$vert = imageColorAllocate($monImage, 0,255,0);
$rouge = imageColorAllocate($monImage, 255,0,0);
$bleu = imageColorAllocate($monImage, 0,0,255);
$gris = imageColorAllocate($monImage, 128,128,128);
$blanc = imageColorAllocate($monImage, 255,255,255);
imageFill($monImage, 0, 0, $noir);
/* on va maintenant créer une cinquantaine d'arcs de cercle
correspondant à la portion à représenter,
en réduisant à chaque fois leur diamètre
: */
for( $diametre = 100; $diametre > 0 ; $diametre -= 2)
{
imageArc( $monImage, 150,150, $diametre
, $diametre , $debut, $fin, $$couleur );
}
/* on le voit c'est ici que l'on utilise de façon répétée
nos valeurs début, fin et couleur. Parceque la couleur
est passée sous la forme d'une chaîne de caractères
"vert", et que la valeur correspondante est créée
dans le script sous la forme d'une variable "$vert",
il nous faut déréférencer la variable $couleur
créée par l'interpreteur php. En écrivant
$$couleur nous recréons la variable "$vert".
*/
// on remplit de rouge toute la portion restante :
for($diametre = 100; $diametre > 0 ; $diametre -= 2){
imageArc( $monImage, 150,150, $diametre , $diametre , $fin, $debut,
$rouge );}
// Pour placer avec précision une légende maintenant
:
$part = ($fin - $debut);
// c'est la proportion, nous voulons la légende au milieu
de la part
$alpha = $debut + $part/2;
//c'est l'angle dont on doit trouver le delta
// cet angle est en degrés or les fonction trigonométriques
retournent une valeur en radians
//on convertit :
$alpha = $alpha * 2*M_PI/360;
//Rappel le delta c'est la position du centre + le rayon * cos(alpha)
et le centre + le rayon * sin(alpha)
$posX = 150 + 100/2 * cos($alpha);
$posY = 150 + 100/2 * sin($alpha);
//on écrit donc la légende en jaune police n°
deux :
imageString($monImage, 2, $posX, $posY, "légende",
$jaune);
imageGif($monImage);
imageDestroy($monImage);
?>
Sur php il n'y pas lieu de chercher ailleurs que sur le site http://www.php.net/
<
Sommaire
|
