title: Preventing d3 translation value in zoom event moving beyond bounds
body: <p>I have a zoom event handler on my tree graph like so:</p>
  
  <pre><code>    d3.select("#"+canvasId+" svg")
        .call(d3.behavior.zoom()
        .scaleExtent([0.05, 5])
        .on("zoom", zoom));
  </code></pre>
  
  <p>Which calls the zoom function which handles the translation bounding logic:</p>
  
  <pre><code>function zoom() {
      console.log(d3.event.translate[0]);
      var wcanvas = $("#"+canvasId+" svg").width();
      var hcanvas = $("#"+canvasId+" svg").height();
      var displayedWidth = w*scale;
      var scale = d3.event.scale;
      var h = d3.select("#"+canvasId+" svg g").node().getBBox().height*scale;
      var w = d3.select("#"+canvasId+" svg g").node().getBBox().width*scale;
      var padding = 100;
      var translation = d3.event.translate;
      var tbound = -(h-hcanvas)-padding;
      var bbound = padding;
      var lbound = -(w-wcanvas)-padding;
      var rbound = padding;
      // limit translation to thresholds
      translation = [
          Math.max(Math.min(translation[0], rbound), lbound),
          Math.max(Math.min(translation[1], bbound), tbound)
      ];
      console.log("Width: "+w*scale+" || Height: "+h*scale+" /// "+"Left: "+translation[0]+" || Top: "+translation[1]);
      d3.select("#"+canvasId+" svg g")
          .attr("transform", "translate(" + translation + ")" +" scale(" + scale + ")");
      console.log(d3.select("#"+canvasId+" svg g")[0]);
  }
  </code></pre>
  
  <p>However, translations beyond the bounds cause the d3.event.translate values to increase. The result is that even if the translation is not causing the graph to move as it has reached its limit for translation, the value for the translation within successive events can continue to increase.</p>
  
  <p>The result is that say I drag the graph far to the left, even though it will stop moving past a certain point, because the value within the events continues to increase, I would then have to drag it a long way back right before it actually begins to move right again.</p>
  
  <p>Is there a good way to prevent this behaviour?</p>