title: Manipulate/creation of SVGs relative to their center
body: <p>I would like to identify the center of an SVG, so that I can manipulate multiple SVGs with ease.</p>
  
  <p>I am trying to make multiple examples of the basic polygons (3 to 8 sides), and quickly realized that I either hade to make my own, which involves a lot of math, or I could pull from  wikipedia the current ones.   The problem with the former is that it takes a lot of time to translate the coordinates from Sketchup.  The problem with the latter is that they are oriented differently and of different size.</p>
  
  <p>I know that you can transform, scale, and rotate the SVG, but I need to know the coordinates of the center of the SVG.   How do I find this out, so I can set universal manipulations?</p>
  
  <p>Take the <code>transform="rotate(degrees x y)"</code>, I need to know the center to accomplish this.</p>
  
  <p><a href="http://jsfiddle.net/chrisfrisina/2BBjy/" rel="nofollow">JS Fiddle</a>
  Here, I would like to set all the centers to the same, and then scale them to the same height and width, and potentially rotate them individually so that they all have a flat bottom, not a vertex.</p>