Accueil    Codes    svg - polygon
 



Html5 SVG - element polygon  Html5 SVG - element polygon



Création d'éléments SVG de type polygon



L'élément polygon permet de dessiner une forme fermée à partir d'une suite de segments. Le dernier couple de coordonnées spécifié sera automatiquement relié au premier couple pour fermer la forme.
    - points : Liste de points sous la forme Xi,Yi

Il est possible de définir autant de points que l'on souhaite, cependant il faut veiller à bien respecter la syntaxe, chaque système de point étant séparé du suivant par un espace (points="X1,Y1 X2,Y2 ... Xn,Yn")


Exemple SVG - Polygone



<svg width="600" height="200" viewBox="0 0 600 200" zoomAndPan="disable"
   xmlns="http://www.w3.org/2000/svg">
   <desc>Exemple SVG - Polygone</desc>

   <polygon fill="firebrick" stroke="gold" stroke-width="4"
      points="80,15 99,71 154,71 114,110 130,171 80,130 30,171 46,110 6,71 61,71" />

   <polygon fill="lightsteelblue" stroke="midnightblue" stroke-width="2"
      points="250,200 300,200 300,150 350,150 350,200 400,200 400,0 450,0 450,200 500,200 500,50 550,50 550,200" />
</svg>