Présentation
Présentation du SVG inline
Graphique Vectoriel Evolutif en ligne
Le Scalable Vector Graphics (SVG) est d'abord un format d'images vectorielles basé sur le langage XML permettant de décrire des ensembles de graphiques vectoriels.Les fichiers SVG sont classiquement créé à partir de logiciel vectoriel comme Adobe Illustrator ou le gratuit Inkscape et affichés dans une page Web comme ceci :
<object data="monrectangle.svg" width="100%" height="400px" type="image/svg+xml"></object>
Mais avec l'arrivé du HTML5, le svg est aussi une balise HTML.
Les navigateurs compatiblent avec HTML5 acceptent de lire de véritable fragments SVG en incorporation HTML5, sans utilisation d'objet étranger (simple inclusion d'une balise <svg> au sein du code HTML).
HTML5 permet donc d'utiliser la méthode de fragments SVG intégrés dans le code (ou SVG inline). Voici un exemple :
<DOCTYPE html>
<html>
<body>
<svg height="190">
<polygon points="100,10 40,180 190,60 10,60 160,180"
style="fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd;">
</svg>
</body>
</html>
source: w3schools.com<html>
<body>
<svg height="190">
<polygon points="100,10 40,180 190,60 10,60 160,180"
style="fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd;">
</svg>
</body>
</html>