Cette page a été traduite à partir de l'anglais par la communauté. Vous pouvez contribuer en rejoignant la communauté francophone sur MDN Web Docs.

View in English Always switch to English

points

L'attribut point défini une liste de points. Chaque point est défini par deux nombres représentant les coordonnées X et Y dans le système de coordonnées de l'utilisateur. Si une coordonnées est dépareillée elle sera ignorée.

Les éléments <polyline> et <polygon> utilisent cet attribut.

Exemple

html
<svg viewBox="-10 -10 220 120" xmlns="http://www.w3.org/2000/svg">
  <!-- polyline est une forme ouverte -->
  <polyline stroke="black" fill="none" points="50,0 21,90 98,35 2,35 79,90" />

  <!-- polygon est une forme fermée -->
  <polygon
    stroke="black"
    fill="none"
    transform="translate(100,0)"
    points="50,0 21,90 98,35 2,35 79,90" />

  <!--
  Il est généralement recommendé de séparer les valeurs X et Y
  avec une virgule et les coordonées avec des espaces.
  Cela est plus lisible.
  -->
</svg>

polyline

Pour un élément <polyline>, points défini une liste de point, chaqu'un représente le vecteur pour tracer la ligne. Chaque point est défini par X et Y dans le système de coordonées de l'utilisateur.

Note : Un polygone est une forme ouverte, ce qui implique que le dernier point n'est pas connecté au premier point.

Valeur [ <number>+ ]#
Valeur par défaut aucune
Peut être animé Oui

Exemple

html
<svg viewBox="-10 -10 120 120" xmlns="http://www.w3.org/2000/svg">
  <!-- polyline est une forme ouverte -->
  <polyline stroke="black" fill="none" points="50,0 21,90 98,35 2,35 79,90" />
</svg>

polygon

Pour un élément <polyline>, points défini une liste de point, chaqu'un représente le vecteur pour tracer la ligne. Chaque point est défini par X et Y dans le système de coordonées de l'utilisateur.

Note : Un polygone est une forme fermée, ce qui implique que le dernier point est connecté au premier.

Valeur [ <number>+ ]#
Valeur par défaut aucune
Peut être animé Oui

Example

html
<svg viewBox="-10 -10 120 120" xmlns="http://www.w3.org/2000/svg">
  <!-- polygon est une forme fermée -->
  <polygon stroke="black" fill="none" points="50,0 21,90 98,35 2,35 79,90" />
</svg>

Spécifications

Specification
Scalable Vector Graphics (SVG) 2
# PolygonElementPointsAttribute
Scalable Vector Graphics (SVG) 2
# PolylineElementPointsAttribute