title: Find centroid of topoJSON path and use it to position a circle in D3
body: <p>In my data I have values associated with countries. I have created scaled circles for each country and would now like to position them at the centre of each country using cx and cy. </p>
  
  <p>I have generated a map using topoJSON that has country-code 'ids' and I have matching country-codes in my data (cd).</p>
  
  <pre><code>{"type": "Polygon",
  "id": 604,
  "arcs": [
    [133, -473, -448, -378, -374, -413]
   ]
  },
  </code></pre>
  
  <p>Using D3's <a href="https://github.com/mbostock/d3/wiki/Geo-Paths#path_centroid" rel="noreferrer">path.centroid(feature)</a>, how can I find the centroid of each topoJSON path? </p>
  
  <pre><code>g.selectAll("circle")
      .data(cd)
      .enter()
      .append("circle")
      .attr("class", "bubble")
      .attr("cx", 50)
      .attr("cy", 50)
      .attr("r", function(d) {
        return r(+d.Value)
      })
  
  g.selectAll("path")
    .data(topojson.object(topology, topology.objects.countries)
      .geometries)
    .enter()
    .append("path")
    .attr("d", path)
  </code></pre>
  
  <p>Full code here <a href="https://plnkr.co/edit/L0dyJboDsngOrJTe2ANh?p=info" rel="noreferrer">Plunker</a></p>