PHP ne se limite pas a la generation de pages (X)HTML. En effet, celui-ci peut egalement afficher des images et les generer a la volee. Vous avez sans doute deja vu des formulaires demandant un code a recopier pour etre sur que ce n'est pas un ordinateur qui remplit les champs automatiquement, et bien PHP permet de creer des images de ce style, mais heureuseument, ses performances ne s'arretent pas la. Vous allez pouvoir creer des images aux possibilites limitees uniquement par votre creativite artistique.
Par defaut, la librairie GD est desactivee. Il va donc falloir l'activer car sinon vous ne pourrez pas faire ce qui va suivre. Pour l'activer, il faut que vous trouviez un fichier nomme "php.ini" qui contient les parametres de configuration de PHP. Ce fichier se situe generalement dans le repertoire "apache2" d'easyPHP ou encore de Wamp. Essayez egalement dans le repertoire C:\Windows. Une fois ce fichier ouvert, localisez la ligne suivante : ;extension=php_gd2.dll, supprimez le point virgule, enregistrez le fichier php.ini puis redemarrez Apache (ou relancez completement le programme que vous utilisez pour travailler en PHP, easyPHP, Wamp, etc ...)
Avant de parler de creation d'image proprement dite, il faut savoir qu'il existe plusieurs types d'images. Les types les plus repandus sur le web sont les formats gif, jpg et png. Cela tombe bien, GD permet de gerer ces trois formats (et d'autres, mais nous ne les utiliserons pas ici).
Pour que le navigateur sāche qu'il envoie une image au navigateur et non une page (X)HTML, on doit envoyer un en-tete special sous peine de voir s'afficher des caracteres incomprehensibles lorsque l'on demandera l'image. Cet en-tete dit juste "voila, j'envoie une image de tel type". On doit renseigner dans cet en-tete (les en-tetes sont aussi appeles headers) le type mime du fichier envoye. Je vais vous donner les trois types mimes que nous utiliserons :
Il faut mainteant que l'on envoie l'en-tete, on utilise pour cela la fonction header() en PHP. Mettons que l'on veuille generer une image jpg, on utilisera le code suivant :
<?php
header('Content-type: image/jpeg');
?>Pour creer une image, il y a deux solutions. Vous pouvez partir de rien du tout (et creer l'image de toutes pieces) ou partir d'une image deja existante sur le disque dur. Pour creer une image en partant de zero, on va utiliser la fonction imagecreate(), pour creer une image a partir d'un fichier, il existe trois fonctions en fonction du type de fichier de l'image source :
En cas d'utilisation d'une fonction imagecreatefromX(), les dimensions de l'image que vous allez generer seront pour le moment dictees par les dimensions de l'image que vous avez ouverte. Dans le cas contraire, il faudra preciser les dimensions de l'image a creer.
Voici un exemple creant une image de base, sans ouvrir d'image existante :
<?php
header('Content-type: image/jpeg');
$image = imagecreate(100, 50); //Cree une image de 100 pixels de large et 50 pixels de haut
?>
Lorsque nous utiliserons les fonctions de la librairie GD, nous travaillerons en coordonnees X, Y selon ce plan :
Pour creer une image tout en se servant d'une image deja existante, voici un exemple pour une image jpeg, il suffit juste de remplacer le nom de la fonction imagecreatefromjpeg par le nom de la fonction qui va bien pour le fichier que vous souhaitez :
<?php
header('Content-type: image/jpeg');
$image = imagecreatefromjpeg('monimage.jpg'); //Cree une image a partir de 'monimage.jpg'
?>
Une fois que vous avez fini de generer votre image, il faut soit l'envoyer au navigateur, soit la sauvegarder sur le disque. On utilise pour cela differentes fonctions qui different uniquement selon le type d'image que vous allez envoyer ou sauvegarder. Voici la liste des fonctions que nous serons amenes a utiliser :
On travaillera en PHP avec le systeme de couleurs RGB (red, green, blue). Ce systeme permet de recomposer une quantite enorme de couleurs a partir de 256 possibilites de rouge, 256 possibilites de vert et 256 possibilites de bleu. Vous pourrez si vous le souhaitez connaitre le code de votre couleur en utilisant un editeur d'images. Windows integre paint par defaut qui permet au moins de connaitre ca ;)
Pour que PHP sāche quelle couleur il doit utiliser, on stocke les couleurs dans des variables. Les "codes couleurs" sont generes grāce a la fonction imagecolorallocate().
<?php
$blanc = imagecolorallocate($image,
255,
255, 255); //Premier 0 : quantite de rouge, second 0 : quantite de vert, troisieme 0 : quantite de bleu
$noir = imagecolorallocate($image, 0, 0, 0);
?>
Le premier imagecolorallocate() que vous ferez correspondra a la couleur de fond de votre image. Vous pourrez toujours le changer de couleur ulterieurement via des bidouilles, mais pensez-y. Si vous souhaitez une image a fond blanc, il faut utiliser le code couleur 255, 255, 255.
GD permet heureusement d'ecrire du texte sur les images. On utilise pour cela la fonction imagestring().
<?php
imagestring($image, $taille_de_police, $x, $y, $texte, $couleur);
?>
Nous allons maintenant detailler les parametres de cette fonction :
Si nous souhaitons ecrire "Salut a tous" aux coordonnees (10, 50) en police noire de taille 4, on procedera comme ceci :
<?php
imagestring($image, 4, 10, 50, 'Salut a tous !', $noir);
?>
Nous allons maintenant voir l'exemple complet :
<?php
header('Content-type: image/jpeg');
$image = imagecreate(100, 50); //Cree une image de 100 pixels de large et 50 pixels de haut
$blanc = imagecolorallocate($image, 255, 255, 255); //Premier 0 : quantite de rouge, second 0 : quantite de vert, troisieme 0 : quantite de bleu
$noir = imagecolorallocate($image, 0, 0, 0);
imagestring($image, 4, 10, 50, 'Salut a tous !', $noir); //Affiche une chaine sur l'image
imagejpeg($image); //Renvoie l'image au navigateur
?>
Remarquez l'utilisation de la fonction imagejpeg() qui prend en parametre l'image que l'on souhaite envoyer/sauvegarder. Cela permet a PHP ici d'envoyer l'image au navigateur.
Heureusement, les possibilites de GD ne s'arretent pas la et il est possible de creer de nombreuses formes. Voici quelques fonctions bien utiles et leurs effets :
Creer une ligne :
La fonction imageline() permet de creer une ligne. Voici un exemple :
<?php
$noir = imagecolorallocate($image,
0, 0, 0);
imageline($image, $x1, $y1, $x2, $y2,
$noir);
?>
Nous venons de creer une ligne. Les coordonnees du premier point sont ($x1,$y1) et du second point ($x2,$y2). La ligne aura une couleur valant $noir (ici la couleur noire, qui vaut 0,0,0 en RVB).
Modifier le style des lignes et des contours de formes :
La fonction imagesetstyle() permet de modifier le style des lignes et des contours de formes pour creer des lignes personnalisees. Voici un exemple :
<?php
header('Content-type: image/gif');
$image = imagecreate(200, 200);
$blanc = imagecolorallocate($image, 255, 255, 255);
$noir
= imagecolorallocate($image, 0, 0, 0);
$rouge = imagecolorallocate($image, 255, 0, 0);
$style = array($noir, $rouge, $noir, $rouge, $rouge, $rouge, $noir); //un pixel noir, un pixel rouge, un pixel noir ...
imagesetstyle($image, $style); //Applique le style sur l'image
imagesetthickness($image, 20); //Modifie l'epaisseur de la ligne
imageline($image, 50, 60, 150, 60, IMG_COLOR_STYLED); //On utilise la constante IMG_COLOR_STYLED qui signifie que GD doit utiliser le style defini plus haut
imagegif($image);
?>
Nous venons de creer une ligne. Les coordonnees du premier point sont (50, 60) et du second point (150, 60). La ligne sera personnalisee (notez la constante IMG_COLOR_STYLED). Il y aura respectivement un pixel noir, un pixel rouge, un pixel noir, trois pixels rouges et un pixel noir (voir le tableau $style).
Voila ce que cela donne en pratique :
Creer un rectangle :
La fonction imagerectangle() permet de creer un rectangle. On l'utilise comme ceci :
<?php
header('Content-type: image/gif');
$image = imagecreate(200, 200);
$blanc = imagecolorallocate($image, 255, 255, 255);
$noir = imagecolorallocate($image, 0, 0, 0);
imagerectangle($image, 50, 50, 150, 150, $noir);
imagegif($image);
?>
Nous venons de creer un rectangle. Les coordonnees du premier point sont ($x1,$y1) et du second point ($x2,$y2). Le rectangle sera comme tous nos exemples precedents noir : $noir (ici la couleur noire, qui vaut 0,0,0 en RVB). Voila ce que cela donne en pratique :
Maintenant appliquons ce que l'on a appris concernant les contours personnalises :
<?php
header('Content-type: image/gif');
$image = imagecreate(200, 200);
$blanc = imagecolorallocate($image, 255, 255, 255);
$noir = imagecolorallocate($image, 0, 0, 0);
$rouge = imagecolorallocate($image, 255, 0, 0);
$style = array($noir, $rouge, $noir, $rouge, $rouge, $rouge, $noir); //un pixel noir, un pixel rouge, un pixel noir ...
imagesetstyle($image, $style); //Applique le style sur l'image, ici la bordure du rectangle sera de ce style
imagesetthickness($image, 10); //Ici, la largeur correspondra a la largeur du contour du rectangle
imagerectangle($image, 50, 50, 150, 150, IMG_COLOR_STYLED);
imagegif($image);
?>
Ca a de la classe non ? Si vous souhaitez que le rectangle soit rempli, on utilise la fonction imagefilledrectangle() qui s'utilise de la meme facon que la fonction imagerectangle().
Creer une ellipse :
Vous pouvez quand meme creer autre chose que des lignes et des rectangles ! Il existe par exemple une fonction vous permettant de creer des ellipses. Celle-ci porte le nom de imageellipse(). Voici ce que ca donne au niveau du code :
<?php
header('Content-type: image/gif');
$image = imagecreate(200, 200);
$blanc = imagecolorallocate($image, 255, 255, 255);
$noir = imagecolorallocate($image, 0, 0, 0);
imageellipse($image, 100, 50, 150, 70, $noir);
imagegif($image);
?>
Et ce que ca donne en pratique :
Inutile que je vous montre comment creer une ellipse avec un contour personnalise, je pense que vous savez comment faire maintenant ;)
Pour ce qui est de l'ellipse remplie integralement, on utilise la fonction imagefilledellipse() qui se comporte comme la fonction imageellipse().
Creer un polygone :
La fonction imagepolygon() permet de creer un polygone. On l'utilise comme ceci :
<?php
header('Content-type: image/gif');
$image = imagecreate(200, 200);
$blanc = imagecolorallocate($image, 255, 255, 255);
$noir = imagecolorallocate($image, 0, 0, 0);
$points = array(50,10,70,60,90,40);
imagepolygon($image,$points,3,$noir);
imagegif($image);
?>
Voici ce que ca donne :
Inutile de vous dire que vous pouvez egalement creer des polygones aux lignes personnalisees ou/et remplis. Ici, le chiffre 3 dans les parametres de la fonction correspond au nombre de points du polygone. Les points sont determines par le tableau $points. Detaillons un peu le principe de ce tableau via cette image :
Les possibilites de GD ne s'arretent pas la. Vous allez pouvoir faire des rotations d'images, rendre des images transparentes, redimensionner des images ...
Voyons comment effectuer la rotation d'une image :
<?php
header('Content-type: image/gif');
$image = imagecreate(150, 150);
$blanc = imagecolorallocate($image, 255, 255, 255); //On a donc une image de 150*150 sur fond blanc
$noir = imagecolorallocate($image, 0, 0, 0);
$image = imagerotate($image, 45, $noir); //L'image sur fond blanc a ete tournee de 45° et le "vide" a ete comble par du noir
imagegif($image);
?>
Rendre une image transparente :
Les images GIF et PNG supportent la transparence. PHP et GD vont vous permettre de definir une couleur transparente sur une image. Reprenons l'image ci-dessus qui a ete tournee de 45 degres. Nous aimerions faire disparaitre le noir. Voila comment on pourrait proceder :
<?php
header('Content-type: image/gif');
$image = imagecreate(150, 150);
$blanc = imagecolorallocate($image, 255, 255, 255); //On a donc une image de 150*150 sur fond blanc
$noir = imagecolorallocate($image, 0, 0, 0);
$image = imagerotate($image, 45, $noir); //L'image sur fond blanc a ete tournee de 45° et le "vide" a ete comble par du noir
$noir = imagecolorallocate($image, 0, 0, 0); //On realloue du noir, l'image ayant ete modifiee.
imagecolortransparent($image, $noir); //Le noir devient transparent
imagegif($image);
?>
Voici ce que cela donne (il reste encore des pixels "presque noirs" voila pourquoi ils n'ont pas ete supprimes, car ils ne sont pas exactement noirs ;) ) :
Redimensionner une image :
PHP et GD sont tres utilises pour redimensionner les images. Par exemple, sur ce site, votre avatar est redimensionne automatiquement si il est trop grand. J'utilise GD pour faire cela, avec une fonction tres simple d'utilisation. Il s'agit de la fonction imagecopyresampled(). Imaginions que nous souhaitions reduire l'image a 100*100 pixels :
<?php
header('Content-type: image/gif');
$image = imagecreate(150, 150);
$destination = imagecreate(100, 100); //Image qui sera l'image de destination
$blanc = imagecolorallocate($image, 255, 255, 255); //On a donc une image de 150*150 sur fond blanc
$noir = imagecolorallocate($image, 0, 0, 0);
$image = imagerotate($image, 45, $noir); //L'image sur fond blanc a ete tournee de 45° et le "vide" a ete comble par du noir
$noir = imagecolorallocate($image, 0, 0, 0); //On realloue du noir, l'image ayant ete modifiee.
$largeur_src = imagesx($image); //Renvoie la largeur de l'image source
$hauteur_src = imagesy($image); //Renvoie la hauteur de l'image source
imagecopyresampled($destination, $image, 0, 0, 0, 0, 100, 100, $largeur_src, $hauteur_src);
imagecolortransparent($destination, $noir); //Le noir devient transparent
imagegif($destination);
?>
Voila ce que l'on obtient :
