W3cubDocs

/Web APIs

SVGPathElement: pathLength property

The pathLength read-only property of the SVGPathElement interface reflects the pathLength attribute of the given <path> element.

Value

An SVGAnimatedNumber.

Examples

>

Accessing the pathLength Property

<svg width="200" height="100">
  <path id="myPath" d="M 0,30 h100" pathLength="50" />
</svg>

const pathElement = document.getElementById("myPath");

// Access the pathLength property
const animatedNumber = pathElement.pathLength;

// The base value of the pathLength attribute
console.log(animatedNumber.baseVal); // Output: 100

Specifications

Specification
SVG Paths>
# __svg__SVGPathElement__pathLength>

Browser compatibility

Desktop Mobile
Chrome Edge Firefox Opera Safari Chrome Android Firefox for Android Opera Android Safari on IOS Samsung Internet WebView Android WebView on iOS
pathLength 1 79 1.5 15 3 18 4 14 2 1.0 4.4 2

See also

© 2005–2025 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/SVGPathElement/pathLength