Convert SVG polygon to path

1. Open your SVG in a web browser.

2. Run this code:

    var polys = document.querySelectorAll('polygon,polyline');
    [].forEach.call(polys,convertPolyToPath);
   
    function convertPolyToPath(poly){
      var svgNS = poly.ownerSVGElement.namespaceURI;
      var path = document.createElementNS(svgNS,'path');
      var pathdata="M "+poly.getAttribute('points');
      if (poly.tagName=='polygon') pathdata+='z';
      path.setAttribute('d',pathdata);
      poly.getAttributeNames().forEach(function(name){
        if(name !== 'points')
          path.setAttribute(name, poly.getAttribute(name))
      })
      poly.parentNode.replaceChild(path,poly);
    }
   

3. Using the Developer Tools (or Firebug) of the browser, use “Copy as HTML” (or Copy SVG) on the element to get the modified source onto the clipboard.

4. Paste into a new file and enjoy.

I have a demo of the above method (slightly modified) on my website:
http://phrogz.net/svg/convert_polys_to_paths.svg

There are two methods in use on that page; one (like the above) uses string-based techniques to get and set the points; the other uses the SVG DOM for accessing points and setting path commands.

---

As noted by @Interactive in the comments, you can do this via text-only transformations by:

1. Convert all <polyline and <polygon to <path

2. Change all points=" to d="M

3. For any elements that were <polygon>, you need to add z as the last character of the d attribute to connect the last point to the first. For example:

    <polygon points="1,2 3,-4 5,6"/> 
   

   becomes

    <path d="M1,2 3,-4 5,6z"/> 
   

This ‘hack’ works because the specifications declare that a moveto command (M or m) followed by multiple coordinates is legal, with all coordinates after the first interpreted as lineto commands.