title: Calculate SVG Path Centroid with D3.js
body: <p>I'm using the SVG located at <a href="http://upload.wikimedia.org/wikipedia/commons/3/32/Blank_US_Map.svg">http://upload.wikimedia.org/wikipedia/commons/3/32/Blank_US_Map.svg</a> in a project and interacting with it with d3.js.  I'd like to create a click to zoom effect like <a href="http://bl.ocks.org/2206590">http://bl.ocks.org/2206590</a>, however that example relies on path data stored in a JSON object to calculate the centroid.  Is there any way to load path data in d3 from an existing SVG to get the centroid?</p>
  
  <p>My (hackish) attempt so far:</p>
  
  <pre><code>  function get_centroid(sel){
      var coords = d3.select(sel).attr('d');
      coords = coords.replace(/ *[LC] */g,'],[').replace(/ *M */g,'[[[').replace(/ *z */g,']]]').replace(/ /g,'],[');
      return d3.geo.path().centroid({
        "type":"Feature",
        "geometry":{"type":"Polygon","coordinates":JSON.parse(coords)}
      });
    }
  </code></pre>
  
  <p>This seems to work on some states, such as Missouri, but others like Washington fail because my SVG data parsing is so rudimentary.  Does d3 support something like this natively?</p>