-1

How can we do something like this in version 4 of d3: http://jsfiddle.net/d3wxP/1/ because some translate or scale does not exist:

function move() {

var t = d3.event.translate, s = d3.event.scale;

t[0] = Math.max(0, Math.min(t[0], width - s*50)); t[1] = Math.max(0, Math.min(t[1], height - s*50));

svg.attr("transform", "translate(" + t + ")scale(" + d3.event.scale + ")"); }

Zlatan Sadibasic
  • 101
  • 6

1 Answers1

0

You need to change it the following way:

function move() {
  var t = d3.event.transform,
      s = d3.event.transform.k;

  t.x = Math.max(0, Math.min(t.x, width - s*50));
  t.y = Math.max(0, Math.min(t.y, height - s*50));

  svg.attr("transform", t);
}

See http://jsfiddle.net/d3wxP/18/

Documentation on that: https://github.com/d3/d3-zoom#zoom-transforms (please note that at some point it might be not backwards compatible).

Nixie
  • 637
  • 4
  • 9