0

私は一連のイタリアのマップを作成しており、このテンプレートから始めました: 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 マッピングの私の最初の試みです :-)
ありがとう
daniele

4

0 に答える 0