css Audio - Active file-generic CSS - Active Generic - Active HTML - Active JS - Active SVG - Active Text - Active file-generic Video - Active header Love html icon-new-collection icon-person icon-team numbered-list123 pop-out spinner split-screen star tv
CodePen probably won't work great in this browser. We generally only support the major desktop browsers like Chrome, Firefox, Safari, and Edge. Use this one at your own risk! If you're looking to test things, try looking at Pens/Projects in Debug View.
user profile image

Converting SVG polygons and polylines to paths as described in Andy Taylor's gist. This provides allows you to use .getTotalLength() and .getPointAtLength(x). thanks for the heads up, @AmeliaBR and @SaraSoueidan


  1. I kind of wince at doing this with RegEx instead of parsing the markup and using DOM methods. But, it gets the job done, and faster than cut & paste!

  2. @AmeliaBR I could just do that too. Even better. I'll make one.

  3. Nice. But I hate to break it to you, outerHTML breaks on SVG elements in Edge. It used to break in Firefox as well, was surprised that it worked. Might be time to ask the Edge folks to support inner/outerHTML on SVG elements, if all the other browsers support it (even if it's not in any spec yet).

  4. Jake, is it possible to reverse this and have a Path to Polyline converter?

Leave a Comment Markdown supported. Click @usernames to add to comment.

You must be logged in to comment.