Je n'ose vraiment pas dire que je "parle" ici de la bibliothèque GD, car je n'ai utilisé GD qu'une ou deux fois, et je n'ai pas encore été en contact avec la plupart des fonctions. Mais Sanbuzhu Xiaodiao m'a demandé avec enthousiasme d'écrire un manuscrit, je n'ai donc eu d'autre choix que de serrer les dents et d'écrire certaines de mes propres expériences. J'espère que cela pourra servir de point de départ.
En fait, nous n'avons pas nécessairement besoin d'utiliser GD pour obtenir l'effet "graphique" dans la page Web. La solution la plus simple est l'histogramme - qui peut être résolu avec HTML. Par exemple :
<? $b = tableau(150,110,125,180,160,175,230,220 );
<html>
<tête>
<méta http-equiv="Content-Type" content="text/html; charset=gb2312">
<titre></titre>
<style>
<!--
td{ taille de police:9pt }
-->
</style>
</tête>
<corps>
<bordure du tableau=0>
<tr valign="bas"> /* (1) */
<?for($i=0;$i<8;$i++) { ?><td align="center">
<table height="<?echo $b[$i];?>" border=0> /* (2) */
<tr>
<td bgcolor="#3F7F9F" width="40"></td> /* (3) */
</tr>
</table><br><font color="#3F7F9F"><?echo $b[$i];?></font> /* (4) */
</td><? } ?>
</tr>
</table>
</corps>
</html>
<? $b = array(150,110,125,180,160,175,230,220); Il s'agit d'un ensemble de données qui n'a rien à voir avec la situation globale. J'ai ajouté quelques phrases. le code. Notes, expliquons-les un par un maintenant.
(1) Ce qu'il convient de noter ici est valign="bottom", qui consiste à aligner le bas du contenu de la cellule. Pourquoi l'ajouter dans <tr>
Étoffe de laine? Vous pouvez faire en sorte que le contenu de cette ligne du tableau suive cet alignement sans avoir à le spécifier dans chaque <td>.
De cette façon, le code original de la page HTML issue de l’exécution de PHP peut économiser des dizaines d’octets ! Économisez un temps précieux au spectateur.
(2) Attention, le plus critique est ici ! <table height="xxx">, on utilise l'attribut height de la table pour
Pour réaliser des « colonnes » de différentes hauteurs. Afin que tout le monde puisse y voir clairement, les données originales n'ont pas été mises à l'échelle proportionnellement.
Si vos données sont particulièrement volumineuses ou petites, il n'est pas approprié de les attribuer directement à l'attribut height du tableau, mais plutôt en fonction de la situation.
Les données doivent être mises à l'échelle de manière appropriée. Par exemple, vous estimez que chaque nombre de votre ensemble de données sera compris entre 3 000 et 8 000.
Vous pouvez envisager de les réduire 25 fois, soit height="<? echo floor(b[$i]/25); ?>"
(3) Mentionnez bgcolor="#xxxxxx" dans cette ligne, qui est la couleur du cylindre (RVB). En fait, le véritable histogramme devrait être
Chaque cylindre utilise une couleur. Afin de garder le code aussi simple que possible, j'ai utilisé cette boucle for, il n'y a donc aucun moyen de donner.
Chaque cylindre se voit attribuer une couleur. ——En fait, il existe un moyen, je n'ai tout simplement pas vraiment besoin de l'écrire pour cet exemple.
Une fonction qui extrait les couleurs pour dérouter les débutants. C’est donc à vous de perfectionner cette partie.
(4) Ici, les données réelles sont affichées dans la même couleur que les barres. Bien entendu, vous pouvez également choisir de mettre ce numéro en haut du cylindre.
, peut-être plus professionnel. Cependant, j'ai toujours l'habitude de le mettre ci-dessous.
À l'aide de tableaux HTML, nous pouvons construire divers histogrammes. Cet exemple utilise bgcolor pour afficher des blocs de couleur.
De plus, vous pouvez également utiliser background="(picture)". L'image est structurée, donc la colonne de l'histogramme comporte des motifs.
Et si vous affichez les données réelles dans une couleur très contrastée dans le <td> montré dans la note (3) ci-dessus, cela aura également un très bon effet.
Ce qui précède est un moyen efficace d'éviter GD, mais si vous souhaitez créer des graphiques complexes, vous devez utiliser GD.
Malheureusement, dans le manuel PHP4 chinois, il est dit qu'il y a 44 fonctions dans la bibliothèque de fonctions GD, mais j'ai regardé la dernière version du manuel PHP4 anglais,
Il existe déjà plus de 80 fonctions GD ! Étant donné que l'anglais de l'auteur est médiocre, je ne peux que faire des suppositions en lisant le manuel en anglais, donc je ne sais pas si la nouvelle bibliothèque GD prend à nouveau en charge le GIF ? Quoi qu'il en soit, je pense que puisque nous utilisons PHP qui est totalement gratuit, pourquoi devrions-nous « risquer » d'utiliser un GIF protégé par le droit d'auteur ? Pourquoi ne pas opter gratuitement et utiliser PNG ? Tant que vous n'avez pas besoin d'animation, PNG peut également créer des fichiers aussi petits que GIF !
Ensuite, je combinerai un programme et décrirai ces fonctions GD couramment utilisées, une phrase à la fois.
Commençons par le début.
<?
Header("Type de contenu : image/png");
// Ceci envoie un en-tête HTTP pour dire au navigateur : "Écoutez, c'est une image, ne l'affichez pas sous forme de texte !"
// En raison de mes préférences personnelles, j'ai utilisé PNG. Bien sûr, vous pouvez également utiliser Header("Content-type: image/gif");
// Ou Header("Type de contenu : image/jpeg");
$im = ImageCréer (50, 100) ;
// Créer une image. Notez que le format de l'image n'a pas été attribué lors de sa création.
// Fonction ImageCreate, deux paramètres, sans aucun doute, c'est la largeur et la hauteur de l'image créée.
// Sa valeur de retour est une valeur int. Cette valeur est très importante. Vous continuez à dessiner cette image.
// Jusqu'à ce que vous sortiez cette image, cette valeur est utilisée partout. Appelons-la l'ID de l'image.
// La fréquence d'utilisation étant assez élevée, nous l'attribuons à une variable avec un nom plus court.
// Traçons maintenant une ligne. La fonction de dessin de ligne est la suivante :
// ligne d'image (int im, int x1, int y1, int x2, int y2, int col);
// Le premier paramètre im est l'ID de l'image, suivi de x1, y1, x2, y2, il va sans dire,
// Ce sont les coordonnées du point de départ (x1, y1) et du point final (x2, y2) ! (Les coordonnées du coin supérieur gauche de l'image sont (0,0))
//Quel est le dernier paramètre ? C'est la couleur ! GD nécessite de définir des couleurs pour les images et d'utiliser ces couleurs définies pour dessiner.
// Pourquoi devons-nous définir des couleurs pour les images ? Je suppose qu'il est utilisé comme une "palette" pour les images GIF, PNG et autres.
// Cela implique la connaissance de l'image elle-même, je n'entrerai donc pas dans les détails ici.
//Donc, avant de tracer la ligne, il faut d'abord définir la couleur (ce qui est vraiment gênant).
// $col_red = ImageColorAllocate($im, 255 192 192);
// Cette fonction a quatre paramètres, le premier $im... dois-je quand même le dire à chaque fois ? Je ne le dirai pas la prochaine fois !
//Les trois paramètres suivants sont les composantes rouge (R), verte (G) et bleue (B) de la couleur à définir, allant de 0 à 255.
// Cela implique encore une fois des connaissances en physique-optique. Les différentes composantes lumineuses des trois couleurs primaires rouge, vert et bleu,
// Produit des couleurs en constante évolution. La couleur que j'ai définie ci-dessus est le 255 rouge, le 192 vert et le 192 bleu.
// Si je ne me trompe pas, c'est un rouge plus vif. Essayons de tracer une ligne dans un instant.
// Pourquoi attendre un peu ? Parce que si une image n’a qu’une seule couleur, on ne voit rien !
// Rendons d'abord l'arrière-plan noir !
// Bien que cela ne soit pas explicitement indiqué dans le manuel, j'ai constaté que la couleur définie en premier sera utilisée par défaut comme arrière-plan.
$col_black = ImageColorAllocate($im, 0,0,0);
// Définit une couleur. Il n'y a pas de lumière rouge, de lumière verte ou de lumière bleue. Elle est naturellement noire - noire.
// Définissez ensuite la couleur utilisée pour tracer la ligne :
$col_red = ImageColorAllocate($im, 255 192 192);
// Vous pouvez maintenant commencer à tracer des lignes rouges :
ligne d'image ($im, 10, 20, 45, 85, $col_red);
// Ne vous inquiétez pas, vous ne pourrez plus voir l'image après avoir terminé cette phrase.
ImagePNG($im);
// Cette phrase génère une image. ImagePNG() génère une image png et ImageJPEG génère une image jpeg.
// ImageGIF sortie image gif...
// N'oubliez pas qu'il y a un paramètre ici, s'il est affiché à l'écran au lieu d'être enregistré dans un fichier,
// Omettez ce paramètre - le nom du fichier enregistré. Si vous souhaitez l'enregistrer sous forme de fichier,
// Il faut l'écrire comme ceci : ImagePNG($im,"test.png");
// Si aucun chemin n'est spécifié, ce fichier est enregistré dans le répertoire courant de votre web.
// S'il s'agit de JPEG, il y a un paramètre supplémentaire, qui est la qualité JPEG (0~100).
// Si vous souhaitez l'afficher à l'écran, ImageJPEG($im,"",80);
// Si vous souhaitez enregistrer, ImageJPEG($im,"test.jpg",80);
// Notez que si vous souhaitez enregistrer cette image sous forme de fichier,
// Vous ne pouvez pas utiliser Header("Content-type: image/png"); pour envoyer l'en-tête HTTP qui signifie une image,
// Parce qu'une fois que cela se produit, cela signifie que vous générerez une image.
ImageDestroy($im);
// Détruit l'image en mémoire pour libérer de l'espace mémoire.
// Ça y est : le dessin GD le plus simple est réalisé.
// Grâce aux tests, il a été constaté que le fichier image généré au format PNG ne contient que 131 octets.
// L'utilisation du format JPEG, même en utilisant la pire qualité (0), nécessite 855 octets et la qualité de l'image est trop mauvaise pour être visualisée.
// La qualité JPEG la plus élevée nécessite 2 360 octets, mais les couleurs ne sont toujours pas aussi vives qu'avec PNG.
// On constate que pour ce genre d'image avec un petit nombre de couleurs, utiliser le PNG est bien plus rentable que le JPEG.
?>
Cette fois, je m'arrêterai ici et j'essaierai de continuer à écrire le plus tôt possible.