SVGPointList

The SVGPointList interface represents a list of DOMPoint objects.

An SVGPointList can be designated as read-only, which means that attempts to modify the object will result in an exception being thrown.

Instance properties

• length Read only
  • : Returns the number of points in the list.
• numberOfItems Read only
  • : Returns the number of points in the list.

Instance methods

• clear()
  • : Removes all items in the list.
• initialize()
  • : First removes all items in the list, then adds a single value to the list.
• getItem()
  • : Gets an item from the list at a specified position.
• insertItemBefore()
  • : Inserts an element into the list at a specified position.
• replaceItem()
  • : Replaces an item in the list with a new item.
• removeItem()
  • : Removes an item from the list.
• appendItem()
  • : Adds an item to the end of the list.

Examples

The following example shows an SVG which contains a <polyline> with five coordinate pairs. The points property returns an SVGPointList.

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

const example = document.getElementById("example");
console.log(example.points); // An SVGPointList

Specifications

Browser compatibility