Formes

DéfinitionRectangle

1
<rect x="50" y="20" rx="20" ry="20" width="150" height="150" />

x,y : coordonnées de départ

rx, ry : arrondis des coins

width, height : largeur et hauteur

SVG - Rectangle

DéfinitionDisque

1
<circle cx="50" cy="50" r="40" />

cx,cy : coordonnées du centre

r : rayon

SVG - Cercle

DéfinitionEllipse

1
<ellipse cx="150" cy="80" rx="100" ry="50" />

cx,cy : coordonnées du centre

rx, ry : rayon horizontal et vertical

SVG - Ellipse

DéfinitionLigne

1
<line x1="10" y1="10" x2="100" y2="100" stroke="black" />

x1,y1 : coordonnées du point de départ

x2, y2 : coordonnées du point d'arrivé

stroke : couleur du trait

SVG - Ligne

DéfinitionPolygone

1
<polygon points="150,10 250,150 150,110 50,150" />

points : coordonnées des différents coins x1,y1 x2,y2 x3,y3 ...

SVG - Polygone

DéfinitionPolyligne

1
<polyline fill="none" stroke="black" points="150,10 250,150 150,110 50,150" />

points : coordonnées des différents points joints par un trait x1,y1 x2,y2 x3,y3 ...

fill : remplissage de la forme créée par le trait

stroke : couleur du trait

SVG - Polyline