|
Ceux qui ont lu notre dossier
de présentation de SVG savent que le SVG est un concurrent
opensource du format propriétaire Flash de Macromedia: il
s'agit d'un langage de dessin vectoriel en deux dimensions, conforme
au standard XML
et défini par la DTD
SVG. Il est créé et soutenu par le W3C
et, principalement, Adobe (concepteur du plug-in
SVG le plus répandu).
Pour résumer les nombreux avantages de SVG face à
Flash, nous parlerons seulement de ses capacités d'accessibilité,
le fait de pouvoir utiliser les CSS et XSLT, d'être indexable
par les moteurs de recherche... Ses grands défauts sont les
suivants: plug-in est moins diffusé que Flash (mais étant
donné que c'est un standard Web, gageons que cela évoluera
rapidement) et format moins "sophistiqué" (c'est
là où il faut faire le choix entre le court terme
et le long terme), bien que SVG ait plus ou moins les mêmes
capacités avec l'utilisation de scripts JavaScript et de
SMIL.
Tout développeur Web doit donc prévoir d'intégrer
SVG à sa trousse à outils. Pour ceux qui sont déjà
familier du format, nous passons ici à une étape plus
dynamique: SVG et PHP. Nous supposons donc que vous connaissez déjà
la plupart des balises SVG...
Premier exemple
Commençont par un exemple très simple et un brin chauvin:
(fichier drapeau.php)
<?php
header("Content-type: image/svg+xml");
echo '<?xml version="1.0" encoding="iso-8859-1"?>';
$texte = "Vive la France!";
?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg xml:space="default" width="300" height="200">
<rect style="fill:#0000ff" x="0" y="0" width="100"
height="200"/>
<rect style="fill:#ffffff" x="100" y="0" width="100"
height="200"/>
<rect style="fill:#ff0000" x="200" y="0" width="100"
height="200"/>
<text x="150" y="100" style="text-anchor:middle;
fill:#000000; font-size:30; font-weight:15; font-family:Tahoma,
Verdana; font-style:regular">
<?=$texte;?>
</text>
</svg>
Comme vous pouvez le voir, à partir du moment où
vous maîtrisez les balises SVG, intégrer du PHP en
leur sein est extrêmement facile. Le script ci-dessus génère
une image SVG grâce à la fonction header(),
qui indique le type MIME que l'on envoi au navigateur: à
lui ensuite de gérer ce type de la manière qu'il peut,
à savoir, si le plug-in SVG est présent, afficher
l'image. L'exemple est volontairement simpliste pour montrer combien
on peut facilement prendre un fichier SVG existant et lui assigner
des traitements PHP.
Bien entendu, nous ne faisons ici que générer le fichier
SVG, qui sera seul dans sa page. Pour l'intégrer à
une page HTML, il faut faire appel à la balise EMBED. Cela
nous permet d'intégrer des variables dynamique, comme ici
avec texte=Mon texte... :
<embed src="drapeau.php?texte=Mon texte"
width="300" height="200">
...ou...
<embed src="drapeau.php?texte=Mon autre texte"
name="SVG1" width="300" height="200"
type="image/svg-xml"
pluginspage="http://www.adobe.com/svg/viewer/install/">
Les possibilités
offertes sont donc immenses, notamment lorsque l'on relie le duo
PHP-SVG à une base de données...
Page 1 | 2
|
[