Scalable Vector Graphics (SVG)

Introduction

Scalable Vector Graphics (SVG) est un format XML standardisé par le W3C qui offre de nombreux avantages sur les autres formats vectoriels :

• C’est un format ouvert, non-propriétaire, au contraire de DXF, DWG et DWF (Autodesk), EMF, EMZ, WMF, WMZ ou CGM (Microsoft), PDM (Adobe) ou Flash (Macromedia) et bien d’autres
• La version comprimée (.SVGZ) est très compacte. En sauvant par exemple un grand plan CAO en différents formats, seul DWF produit un fichier encore plus petit que SVGZ
• SVG supporte l’animation presque aussi bien que Flash, auquel il ressemble beaucoup.
• SVG peut être affiché sur des pages web.

Affichage

Pour visualiser des fichiers SVG ou des pages contenant du SVG, tout dépend de votre navigateur:

• Mozilla Firefox supporte désormais SVG en mode natif
• Microsoft Internet Explorer a besoin d’un plugin, le plus connu étant Adobe SVG Viewer
• Opera nécessite d’installer un plugin en suivant ces instructions

Génération

On peut créer des fichiers SVG de différentes manières:

1. avec un programme de dessin pouvant exporter, voire importer du SVG:
   • Adobe Illustrator (v.9 export, v.10 import/export)
   • Corel Draw Draw v.11 import+export
   • IsoDraw
2. Avec un programme de dessin spécialisé en SVG comme InkScape, XStudio, WebDraw.
3. En « imprimant » n’importe quel document depuis n’importe quelle application (notamment les CAO comme SolidWorks…) grâce au génial ePrint
4. Certains programmes spécialisés produisent des résultats au format SVG. C’est notamment le cas de ImageMagick et GraphViz, qui génère automatiquement de beaux graphes à partir d’une simple description texte. Sur http://www.cadml.org je montre comment générer ainsi des graphes de dépendances entre fichiers CAO, un peu sur le même principe que Doxygen.
5. En « programmant » directement le code SVG. En principe on peut le faire avec un simple éditeur de texte, mais il existe des éditeurs XML comme Amaya ou XML Spy

Programmation

http://www.svgbasics.com contient tout ce qu’il faut savoir pour créer des fichiers SVG, mais c’est en anglais. En français il existe ce cours qui est bien fait.

http://blog.codedread.com/archives/2005/12/01/guide-to-deploying-svg-with-html

Références

• http://svgfr.org et http://www.svg.org
• Comment intégrer du svg dans un article spip
• Embedding SVG in WordPress posts