title: How to scale and translate together?
body: <p>I want to scale and translate D3 force graph, both at the same time. E.g. On clicking a button it shoud scale to 400% and then make itself center on the screen. This should all happen with a smooth animation effect.</p>
  
  <pre class="lang-js prettyprint-override"><code>//animate vis to visible area 
  vis.transition()
      .duration(2000)
      .attr("transform", "scale(" + someScaleValue + ")" + "center("0,0)");
  </code></pre>
  
  <p>Doing this, scaling works fine, but graph is not centered. It shifts towards right-bottom corner.</p>
  
  <pre class="lang-js prettyprint-override"><code>vis.transition()
      .duration(2000)
      .attr("transform", "scale(" + someScaleValue + ")");
  </code></pre>
  
  <p>Why is scale is getting reset to 100% when I translate it second time.</p>
  
  <p>I also tried using:</p>
  
  <pre class="lang-js prettyprint-override"><code>vis.transition()
      .duration(2000)
      .attr("transform", "scale(" + scaleValue + ")" + "translate(0,0)");`
  </code></pre>
  
  <p>This is not working too. Please help me.</p>