Examples PHP MySql Graphisme

Graphisme

Voici d'abord un recueil de fonctions de définition de couleurs : colorlib.php

<?
/*----------------------------------------------------------
	Définition des couleurs compatibles Netscape
	fonctions de tracé de graphiques
	(c) Jean-Paul Molina
-----------------------------------------------------------*/

Voici maintenant un exemple de création dynamique d'image.
Il s'agit de visualiser les résultats d'un étudiant de classe prépa pour un ensemble de matières suivies, ainsi que les notes maxi, mini, moyenne du groupe.
La visualisation graphique permet de voir rapidement le profil de l'étudiant.
Voici l'allure du résultat pour un étudiant donné :

graphique en php

Et maintenant le contenu du fichier grafnotes.php

<?
include ("colorlib.php");
/*-------------------------------------------------------------------------
	point en forme de losange
	coordonnées x,y rempli avec la couleur et image valide
-------------------------------------------------------------------------*/
function losangedot($x, $y, $color, $img )
{
	$points = array($x,$y-2,$x+2,$y,$x,$y+2,$x-2,$y);
	return imageFilledPolygon( $img, $points, count($points)/2, $color);
}
/*-------------------------------------------------------------------------
	point en forme de carré
	coordonnées x,y rempli avec la couleur et image valide
-------------------------------------------------------------------------*/
function squaredot($x, $y, $color, $img )
{
	$points = array($x-2,$y-2,$x+2,$y-2,$x+2,$y+2,$x-2,$y+2);
	return imageFilledPolygon( $img, $points, count($points)/2, $color);
}
/*-------------------------------------------------------------------------
	point en forme de triangle
	coordonnées x,y rempli avec la couleur et image valide
-------------------------------------------------------------------------*/
function triangledot($x, $y, $color, $img )
{
	$points = array($x,$y-2,$x+2,$y+1,$x-2,$y+1);
	return imageFilledPolygon( $img, $points, count($points)/2, $color);
}
/*-------------------------------------------------------------------------
	point en forme de cercle
	coordonnées x,y rempli avec la couleur et image valide
-------------------------------------------------------------------------*/
function cercledot($x, $y, $color, $img )
{
	return imageArc($img, $x, $y, 2, 2, 0, 360, $color );
}
/*-------------------------------------------------------------------------
	marques horizontales axe des ordonnées
	coordonnées x,y du point milieu avec la couleur et image valide
-------------------------------------------------------------------------*/
function Htick($x, $y, $color, $img)
{
	return imageLine($img, $x-3, $y, $x+3, $y, $color);
}
/*-------------------------------------------------------------------------
	marques verticales axe des abscisses
	coordonnées x,y du point milieu avec la couleur et image valide
-------------------------------------------------------------------------*/
function Vtick($x, $y, $color, $img)
{
	return imageLine($img, $x, $y-3, $x, $y+3, $color);
}
/*-----------------------------------------------------------------------
	ligne des ordonnées notes
	tracé du haut vers le bas
----------------------------------------------------------------------*/
function ordNotes($x, $y, $deltaY, $color, $img)
{
	// pb avec les polices TrueType allors j'utilise les
	// polices prédéfinies 1.. 5 : ici choix 5
	$font = 5;
	$xpad = 5;
		// affiche le label "20" (c'est la note la plus haute)
	$labelY = "20";
	$start_x = $x - (strlen($labelY)*imageFontWidth($font)) -$xpad;
	$start_y = $y - imageFontHeight($font) / 2;
	imageString($img, $font, $start_x, $start_y, $labelY, $color);
		// affiche 0 ... 19
	for ( $i = 0; $i < 19; $i++) 
	{
		$yfin = $y + ($i+1)*$deltaY; 
		Htick($x, $yfin, $color, $img); 	// marque horizontale
		$labelY = 19 - $i;
		$start_x = $x - (strlen($labelY)*imageFontWidth($font)) -$xpad;
		$start_y = $yfin - imageFontHeight($font) / 2;
		imageString($img, $font, $start_x, $start_y, $labelY, $color); // label
	}	
	imageLine($img, $x, $y, $x, $yfin+$deltaY, $color); // ligne verticale des ordonnées
}
/*-----------------------------------------------------------------------
	ligne des abscisses matières
----------------------------------------------------------------------*/
function absMatieres($tabX, $x, $y, $deltaX, $n, $color, $img)
{
	// trace les marques verticales de l'axe des abscisses
	for ( $i = 0; $i < $n-2; $i++) // pas le dernier 
	{
		$xfin = $x + ($i + 1)*$deltaX;
		Vtick($xfin, $y, $color, $img);	// trace les marques verticales
	}	
	imageLine($img, $x, $y, $xfin+$deltaX, $y, $color);// trace l'axe des abscisses

// polices prédéfinies 1.. 5 : ici choix 3
	$font = 3;
	$ypad = 5;
		// affiche les noms de matiére
	$notes = explode(";", $tabX) ; // convertit en tableau
	for ($i = 0; $i < $n; $i++)
	{
		$labelX = $notes[$i]; // les n premiers sont les matières
		$start_y = $y + (strlen($labelX)*imageFontWidth($font)) + $ypad;
		$start_x = $x + ($i * $deltaX) - (imageFontHeight($font) / 2);
		imageStringUp($img, $font, $start_x, $start_y, $labelX, $color);
	}
}
/*----------------------------------------------------------------------------------------------------------------
	fonction : posY
	objectif : calcule la position en pixel à partir du haut
	entrées : la note x, la hauteur de la zone en pixels
	sortie : la valeur à partir du haut
----------------------------------------------------------------------------------------------------------------*/
function posY($x, $h)
{
	return ( $h * ( 1 - ($x / 20) ) );
} 
/*-----------------------------------------------------------------------------------------------------------------
	fonction : ligne_etudiant
	trace la ligne brisée des notes de l'étudiant
----------------------------------------------------------------------------------------------------------------*/
function ligne_etudiant( $tabX, $x, $y, $hzone, $deltaX, $n, $color, $img)
{
	$notes = explode(";", $tabX) ; // convertit en tableau

for ( $i = 0; $i < $n-1; $i++) 
	{
		$xdep = $x + $i * $deltaX;
		// de 0 à n-1 : noms de matière
		$ydep = $y + posY( $notes[$n+$i], $hzone);
		$xfin = $x + ($i + 1)*$deltaX;
		$yfin = $y + posY( $notes[$n+$i+1], $hzone);
		imageLine($img, $xdep, $ydep, $xfin, $yfin, $color);
		imageLine($img, $xdep, $ydep+1, $xfin, $yfin+1, $color); // epaisseur de trait double
	}
}
/*-----------------------------------------------------------------------------------------------------------------
	fonction : ligne_maxi
	trace la ligne brisée des notes maxi du groupe
----------------------------------------------------------------------------------------------------------------*/
function ligne_maxi( $tabX, $x, $y, $hzone, $deltaX, $n, $color, $img)
{
	$notes = explode(";", $tabX) ; // convertit en tableau

for ( $i = 0; $i < $n-1; $i++) 
	{
		$xdep = $x + $i * $deltaX;
		// à partir de 2n, on a triplet (maxi, moyenne, mini)
		$ydep = $y + posY( $notes[2*$n+3*$i], $hzone);
		$xfin = $x + ($i + 1)*$deltaX;
		$yfin = $y + posY( $notes[2*$n+3*($i+1)], $hzone);
		imageLine($img, $xdep, $ydep, $xfin, $yfin, $color);
	}
	$font = 3;
	imageString($img, $font, $xfin+5, $yfin-(imageFontHeight($font) / 2), "Maxi", darkblue($img) );
}
/*-----------------------------------------------------------------------------------------------------------------
	fonction : ligne_mini
	trace la ligne brisée des notes mini du groupe
----------------------------------------------------------------------------------------------------------------*/
function ligne_mini( $tabX, $x, $y, $hzone, $deltaX, $n, $color, $img)
{
	$notes = explode(";", $tabX) ; // convertit en tableau

for ( $i = 0; $i < $n-1; $i++) 
	{
		$xdep = $x + $i * $deltaX;
		// à partir de 2n, on a triplet (maxi, moyenne, mini)
		$ydep = $y + posY( $notes[2*($n+1)+3*$i], $hzone);
		$xfin = $x + ($i + 1)*$deltaX;
		$yfin = $y + posY( $notes[2*($n+1)+3*($i+1)], $hzone);
		imageLine($img, $xdep, $ydep, $xfin, $yfin, $color);
	}
	// remplissage
	imageFill($img, $xfin-2, $yfin-5, gainsboro($img) );

$font = 3;
	imageString($img, $font, $xfin+5, $yfin-(imageFontHeight($font) / 2), "mini", darkblue($img) );
}
/*-----------------------------------------------------------------------------------------------------------------
	fonction : ligne_moyenne
	trace la ligne brisée des notes moyennes du groupe
----------------------------------------------------------------------------------------------------------------*/
function ligne_moyenne( $tabX, $x, $y, $hzone, $deltaX, $n, $color, $img)
{
	$notes = explode(";", $tabX) ; // convertit en tableau

for ( $i = 0; $i < $n-1; $i++) 
	{
		$xdep = $x + $i * $deltaX;
		// à partir de 2n, on a triplet (maxi, moyenne, mini)
		$ydep = $y + posY( $notes[(2*$n)+1+3*$i], $hzone);
		$xfin = $x + ($i + 1)*$deltaX;
		$yfin = $y + posY( $notes[(2*$n)+1+3*($i+1)], $hzone);
		imageLine($img, $xdep, $ydep, $xfin, $yfin, $color);
	}
	$font = 3;
	imageString($img, $font, $xfin+5, $yfin-(imageFontHeight($font) / 2), "Moyenne", darkblue($img) );
}

/*-------------------------------------------------------------------------------------------------
	les Y sont orientés vers le bas sur l'écran
les paramêtres de couleur différente sont récupérés globalement lors de l'appel de ce fichier
		( voir partie finale )
--------------------------------------------------------------------------------------------------*/
	if  (@function_exists('imagegif') ) 
	{
		Header("Content-type: image/gif");
		$bgif =true;
	}
	else
	{
		Header("Content-type: image/png");
		$bgif = false;
	}
	/* $tnotes est une variable globale de type array()
	  tableau qui a été rempli au préalable, dans l'ordre suivant :
	- les noms de matière
	- les notes étudiant pour le trimestre ou année
	- les triplets (maxi, moyenne, mini) 
	pour chaque matiere, il y a donc 5 champs : nom, note, maxi, moy, mini */

$dX = 70;	// pixels
	$dY = 20;
	$w = ( $nbre_mat - 1) * $dX ;	// largeur zone graphique
	$h = 20 * $dY;			// notes de 0 à 20
	$largeur = $w + 110;
	$hauteur = $h + 200; 
	$image = imageCreate($largeur, $hauteur); // on commence toujours par cela
	$bkgnd = paleturquoise($image);
	$bleufonce = darkblue($image);
	$rouge = rouge($image);
	$vertfonce = darkgreen($image);
	$mediumblue = mediumblue($image);
	$vert = vert($image);
		// cadre externe
	imageRectangle($image,0,0,$largeur-1,$hauteur-1, mediumblue($image) );
	$xhg = 30;
	$yhg = 20; 
		// nom de l'étudiant
	$afont = 5;
	imageString($image, $afont, 3*$xhg, 3/*imageFontHeight($afont)*/, $qui, darkblue($image) );

// axe des Y en bleu foncé	
	ordNotes($xhg, $yhg, $dY, $bleufonce, $image );
		// axe des X en bleu foncé
	absMatieres( $tnotes, $xhg, $yhg+$h, $dX, $nbre_mat, $bleufonce, $image );
		// termine le cadre
	imageLine($image, $xhg, $yhg, $xhg+$w, $yhg, $bleufonce );	 // horizontale
	imageLine($image, $xhg+$w, $yhg, $xhg+$w, $yhg+$h, $bleufonce ); // verticale
		// ligne des maxi
	ligne_maxi( $tnotes, $xhg, $yhg, $h, $dX, $nbre_mat, $vertfonce, $image);
		// ligne des mini
	ligne_mini( $tnotes, $xhg, $yhg, $h, $dX, $nbre_mat, $mediumblue, $image);
		// ligne notes de l'étudiant en rouge
	ligne_etudiant( $tnotes, $xhg, $yhg, $h, $dX, $nbre_mat, $rouge, $image);
		// ligne moyenne
	ligne_moyenne( $tnotes, $xhg, $yhg, $h, $dX, $nbre_mat, dodgerblue($image), $image);
		// on enjolive
	imageFill($image, $xhg+5, $yhg+5, lightslategrey($image) );
	imageFill($image, $xhg+5, $yhg+$h-5, lightslategrey($image) );

if ( $bgif == true)  ImageGif($image); else  ImagePNG($image);
	ImageDestroy($image);

Pour finir, la fonction appelée pour le tracé du graphique des résultats.
Remarquez bien la dernière ligne : on appelle une image qui n'est pas encore tracée, c'est le serveur qui va faire le travail à la volée.

Il vous reste naturellement à constituer le tableau des notes pour chaque étudiant. Mais ce n'était pas l'objectif ici.

Page de Jean-Paul Molina

Subjects

Resources

C.A.D.

Langages

Flash

Systems

Social Networks

Graphisme