title: Path not showing in d3.js topoJson graph
body: <p>I am trying to draw a map using topoJson so I followed this example</p>
  
  <ul>
  <li><a href="http://bl.ocks.org/mbostock/4122298" rel="nofollow">http://bl.ocks.org/mbostock/4122298</a></li>
  </ul>
  
  <p>but I am not getting anything drawn. </p>
  
  <p>here's what i wrote</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  
  &lt;head&gt;
    &lt;meta charset="utf-8"&gt;
  &lt;style&gt;
  
  path {
    fill: #ccc;
    stroke: #fff;
    stroke-width: .5px;
  }
  
  path:hover {
    fill: red;
  }
  
  &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;script src="http://d3js.org/d3.v3.min.js"&gt;&lt;/script&gt;
  &lt;script src="http://d3js.org/topojson.v1.min.js"&gt;&lt;/script&gt;
  &lt;script&gt;
  
  var width = 960,
      height = 500;
  
  var path = d3.geo.path();
  
  var svg = d3.select("body").append("svg")
      .attr("width", width)
      .attr("height", height);
  
    d3.json("tunisia.json", function(error, topology) {
  
    console.log(topology);
  
    svg.selectAll("path")
        .data(topojson.feature(topology, topology.objects.governorates).features)
        .enter().append("path")
        .attr("d", path);
  });
  
  &lt;/script&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>After some debugging it turns out that the path in my case is added as follows: </p>
  
  <pre><code>&lt;svg width="960" height="500"&gt;
  &lt;path&gt;&lt;/path&gt;
  &lt;path&gt;&lt;/path&gt;
  &lt;/svg&gt;
  </code></pre>
  
  <p>whereas it should normally be like this: </p>
  
  <pre><code>&lt;svg width="960" height="500"&gt;
   &lt;path d="M183.85631949544694,17.16574961388676L184.64695256075555,18.261986556132797L184.24437929962187,21.436416964644536L184.9109502450185,22.72190753660925L183.42733139583214,23.600229178621248L181.43637647772152,23.38526266060535L162.4858998398068,18.04698631290296L162.95134674943927,16.322885588815097L161.24381018256219,15.20848145955324L160.04585728433227,11.701769628478132L161.0879861841512,10.793553936506555L172.9773901748378,14.256236175137701Z"&gt;&lt;/path&gt;
  &lt;/svg&gt;
  </code></pre>
  
  <p>here is the data I am using: 
  <a href="https://raw.githubusercontent.com/mtimet/tnacmaps/master/topojson/tunisia.json" rel="nofollow">https://raw.githubusercontent.com/mtimet/tnacmaps/master/topojson/tunisia.json</a></p>
  
  <p>could you please check what I am doing wrong </p>