title: D3.Geo performance on Pan/Zoom
body: <p>Last year I made a couple experiments on web maps using the <a href="http://mapnik.org/" rel="nofollow noreferrer">Mapnik library</a> (server-side, bitmap/tiling). Now I'm trying to replicate the same experiments using the vector, client-side approach with d3.js.</p>
  
  <p>I have a map (~680 shapes) where <code>zoom</code> is slow and <code>pan</code> is sluggish (<a href="http://bl.ocks.org/mbostock/2374239" rel="nofollow noreferrer">this example</a> by Mike Bostock works well). I suspect the problem is in the <code>zoommove</code> callback, the <code>selectAll("path").attr("d", path)</code> takes too long. </p>
  
  <pre><code>function zoommove() {
      projection.translate(d3.event.translate).scale(d3.event.scale);
      mapa.selectAll("path").attr("d", path);
      console.log('zoommove fired...');
  }
  </code></pre>
  
  <p><strong>Questions</strong>:</p>
  
  <ol>
  <li>Am I doing something wrong here?</li>
  <li>what can I do in order to optmize performance?</li>
  </ol>
  
  <p>The map is this (<a href="http://jsfiddle.net/scardine/CxTL9/embedded/result/" rel="nofollow noreferrer">jsfiddle here</a>):</p>
  
  <p><img src="https://i.stack.imgur.com/EU7Jk.png" alt="Municipalities from São Paulo State, Brazil"></p>
  
  <p>The datasource is in topojson format. It was simplified, may be already too much, because some shapes are not closing:</p>
  
  <p><img src="https://i.stack.imgur.com/4jAX5.png" alt="enter image description here"></p>
  
  <p>[UPDATE]</p>
  
  <p>Looks like the problem with open geometries occurs even when running topojson without simplification flags, I'm still investigating. I would appreciate any clues here, the documentation is not very detailed.</p>