The points attribute defines a list of points. Each point is defined by a pair of number representing a X and a Y coordinate in the user coordinate system. If the attribute contains an odd number of coordinates, the last one will be ignored.

Two elements are using this attribute: <polyline>, and <polygon>

<svg viewBox="-10 -10 220 120" xmlns="http://www.w3.org/2000/svg">
  <!-- polyline is an open shape -->
  <polyline stroke="black" fill="none"
   points="50,0 21,90 98,35 2,35 79,90" />

  <!-- polygon is a closed shape -->
  <polygon stroke="black" fill="none" transform="translate(100,0)"
   points="50,0 21,90 98,35 2,35 79,90"/>

  <!--
  It is usualy considered best practices to separate a X and Y
  coordinate with a comma and a group of coordinates by a space.
  It makes things more readable for human beings.
  -->
</svg>

polyline

For <polyline>, points defines a list of points, each representing a vertex of the line to be drawn. Each point is define by a X and Y coordinate in the user coordinate system.

Note: A polyline is an open shape, meaning the last point is not connected to the first point.

Value [ <number>+ ]#
Default value none
Animatable Yes

Example

<svg viewBox="-10 -10 120 120" xmlns="http://www.w3.org/2000/svg">
  <!-- polyline is an open shape -->
  <polyline stroke="black" fill="none"
   points="50,0 21,90 98,35 2,35 79,90" />
</svg>

polygon

For <polygon>, points defines a list of points, each representing a vertex of the shape to be drawn. Each point is define by a X and Y coordinate in the user coordinate system.

Note: A polygon is a closed shape, meaning the last point is connected to the first point.

Value [ <number>+ ]#
Default value none
Animatable Yes

Example

<svg viewBox="-10 -10 120 120" xmlns="http://www.w3.org/2000/svg">
  <!-- polygon is an closed shape -->
  <polygon stroke="black" fill="none"
   points="50,0 21,90 98,35 2,35 79,90" />
</svg>

Specifications

Specification Status Comment
Scalable Vector Graphics (SVG) 2
The definition of 'points' in that specification.
Candidate Recommendation Definition for <polygon>
Scalable Vector Graphics (SVG) 2
The definition of 'points' in that specification.
Candidate Recommendation Definition for <polyline>
Scalable Vector Graphics (SVG) 1.1 (Second Edition)
The definition of 'points' in that specification.
Recommendation Initial definition for <polygon>
Scalable Vector Graphics (SVG) 1.1 (Second Edition)
The definition of 'points' in that specification.
Recommendation Initial definition for <polyline>

Document Tags and Contributors

Tags: 
Contributors to this page: maxakohler, Jeremie, obensource, rshetty
Last updated by: maxakohler,