Convert an SVG polygon into a path (useful for rendering actual SVGs with Raphaël)

gistfile1.coffee

# Largely inspired by: http://stackoverflow.com/questions/9690241/rendering-svg-polygons-in-raphael-javascript-library

# You have, for example, this:
#   <polygon fill="#00B8C0" stroke="#00FFFF" stroke-miterlimit="10" points="146.5,196.326 137.326,205.5 155.674,205.5 "/>
# You would like this:
#   M147,196L137,206L156,206Z

# Assuming `xml` is your <polygon> node...
polygonToPath = (xml) ->
    p = xml.getAttribute "points"

    path = p.replace(/(\-?[0-9.]+)[\W|,](\-?[0-9.]+)/g, ($0, x, y) ->
      "L" + Math.round(x) + "," + Math.round(y)
    ).replace(/^L/, "M").replace(/$/, "Z").replace(/\s/g, "")