Skip to main content

DrawSVGPlugin.getLength

DrawSVGPlugin.getLength( element:[Element | Selector text] ) : Number

Provides an easy way to get the length of an SVG element's stroke including: <path>, <rect>, <circle>, <ellipse>, <line>, <polyline>, and <polygon>

Parameters

  • element: [Element | Selector text]

    The element (or the selector text for the element) whose stroke length you'd like to determine.

Returns : Number​

The length of an SVG element's stroke.

Details​

Provides an easy way to get the length of an SVG element's stroke including: <path>, <rect>, <circle>, <ellipse>, <line>, <polyline>, and <polygon>.

When combined with the position (obtained using DrawSVGPlugin.getPosition), you can calculate the total percentage at any given moment like so:

function getPercentage(element) {
  return Math.floor(
    DrawSVGPlugin.getPosition(element)[1] /
      (DrawSVGPlugin.getLength(element) / 100)
  );
}

Contents