Un fichier SVG commence par une déclaration de version
XML standard Exemple : <? xml version="1.0" encoding="ISO-8859-1"
standalone="no"?>
Élément racine : La racine d'un
fichier SVG est un élément <svg>. <svg > (...)
</svg> La taille de la fenêtre SVG est définie par les
attributs width et height de l'élément <svg>
Imbrication d'un fichier SVG dans HTML : La
version canonique demande d'utiliser la balise <embed>, sous la forme
<embed src=" fichier_svg.svg" type="image/svg+xml">, il est aussi
possible d'utiliser un environnement iframe : <iframe src=" fichier_svg.svg
" </iframe>
Éléments graphiques de base :
SVG définit un certain nombre d'éléments
graphiques de base. Voici la liste des éléments les plus
importants :
· Texte avec <text> ;
« Mise en place d'un système de gestion de
workflow : Paramétrage, suivi et représentation graphique »
| Page 97
? Rectangles <rect> ;
? Le cercle <circle> et l'ellipse <ellipse> ;
? Lignes <line> et poli-lignes <polyline> ;
? Polygones, Formes arbitraires avec <path>.
Chaque élément graphique est
représenté par un élément XML qui est
paramétrable avec des attributs XML et hérite d'attributs de ses
parents.
Comme dans d'autres langages vectoriels, il existe des formes
géométriques de base (rectangle, ellipse, cercle, lignes,
poly-lignes et polygone). Il existe également une méthode
permettant de produire des formes complexes.
- Rectangles : L'élément <rect>
permet de définir des rectangles, y compris avec
des coins arrondis.
Les attributs de base sont : x et y, qui donnent la position du coin
supérieur gauche. Width et height, qui permettent de définir
respectivement largeur et hauteur du rectangle.
- Cercles et ellipses : Un cercle est
créé par l'élément <circle> et une ellipse
par
l'élément <ellipse>. Leurs attributs principaux sont
: cx et cy qui définissent les coordonnées du centre , r qui
définit le rayon du cercle, rx et ry qui définissent les
demi-axes x et y de l'ellipse.
- Lignes et poly-lignes : Une ligne est
définie avec l'élément <line>, une poly-
ligne
par l'élément <polyline>. Les attributs de <line>
sont : x1 et y1, qui définissent les coordonnées du point de
départ. x2 et y2, qui définissent les coordonnées du point
d'arrivée. L'attribut de base de <polyline> est points qui prend
comme valeur une suite de coordonnées.
- Polygones et formes arbitraires : Il est possible
de créer et dessiner facilement
des chemins (path) ainsi que des
formes géométriques comme les polygones. L'attribut principal
pour le tracé de chemin est d
