Question

我创建了一个带有2d / 3d切换的示例交互式地球仪： https://jsfiddle.net/kmturley/wnovo0rb/3/

对于这两个问题，地球在用户第一次互动时跳跃位置：

第一次2d缩放跳
3d放大，第一次平移跳跃

这是缩放功能（我相信问题所在）：

function zoomed() {
  var transform = d3.event.transform;
  var r = {
    x: λ(transform.x),
    y: φ(transform.y)
  };
  var k = projection.scale() / 200;
  if (d3.event.sourceEvent.wheelDelta) {
    projection.scale(scale * transform.k);
    if (is3D) {
      transform.x = lastX;
      transform.y = lastY;
    } else {
      projection.translate([origin.x + transform.x - (width / 2), origin.y + transform.y - (height / 2)]);
    }
  } else {
    if (is3D) {
      projection.rotate([(origin.x + r.x) / k, (origin.y + r.y) / k]);
    } else {
      projection.translate([origin.x + transform.x - (width / 2), origin.y + transform.y - (height / 2)]);
    }
  }
  lastX = transform.x;
  lastY = transform.y; svg.selectAll('path.graticule').datum(graticule).attr('d', geoPath);
}

Answer 1

在你的小提琴例子的第33和34行，只需从原点移除/ 2部分。

D3交互式地球2d / 3d模式在第一次交互时跳跃

1 个答案: