title: d3.js pan and zoom jumps when using mouse after programatic zoom
body: <p>I'm trying to center my d3 graph when it loads. So I run </p>
  
  <pre><code>var g = svg.append("g");
  
  //... then later
  
  g.call(zoom.transform, center);
  </code></pre>
  
  <p>It's not actually centering, it's just scaling right now. But the scale works. The problem is, when I then scroll to zoom in or out, it starts from <code>1</code> instead of <code>0.5</code>. So it jumps.</p>
  
  <p>Here's my <a href="https://jsbin.com/luqihagaqa/edit?html,js,output" rel="noreferrer">jsbin</a>.</p>