d3映射与缩放,但奇怪的泛限制beavure

时间:2013-11-13 09:24:41

标签: javascript map d3.js mapping zoom

我正在制作一系列意大利地图,我从这个模板开始:http://techslides.com/responsive-d3-map-with-zoom-and-pan-limits/

问题是当放大我的地图http://www.danielepennati.com/prove/mapping/ita_pop_den.html时,平移是有限的,我可以放大地图的东部

投影的定义如下:

var projection = d3.geo.mercator()
      .scale(3300)
      .center([12, 42])
      .translate([width / 2, height / 2]);

和缩放:

var zoom = d3.behavior.zoom()
      .scaleExtent([1, 13])
      .on("zoom", move);
function move() {

    var t = d3.event.translate;
    var s = d3.event.scale;  
    var h = height / 3;

    t[0] = Math.min(width / 2 * (s - 1), Math.max(width / 2 * (1 - s), t[0]));
    t[1] = Math.min(height / 2 * (s - 1) + h * s, Math.max(height / 2 * (1 - s) - h * s, t[1]));

    zoom.translate(t);
    g.style("stroke-width", 1 / s).attr("transform", "translate(" + t + ")scale(" + s + ")");
  }
你能帮助我吗? 这是我第一次使用d3映射:-)
感谢
丹尼尔

0 个答案:

没有答案