Javascript D3地图可见区域坐标

以下是我的d3可缩放地图的简单代码：

  winWidth = $(window).width();
  winHeight = $(window).height();

  projection = d3.geo.mercator()
      .translate([0, 0])
      .scale(winWidth / 2 / Math.PI);

  zoom = d3.behavior.zoom()
      .scaleExtent([1, 50])
      .on("zoom", manageMap);

  path = d3.geo.path()
      .projection(projection);

  svg = d3.select("#map").append("svg")
      .attr("viewBox", "0 0 " + winWidth + " " + winHeight)
      .attr("preserveAspectRatio", "xMidYMid meet")
      .append("g")
      .attr("transform", "translate(" + winWidth / 2 + "," + winHeight / 2 + ")")
      .call(zoom);

  g = svg.append("g");

  d3.json("world-50m.json", function(error, world) {
    g.append("path")
        .datum(topojson.feature(world, world.objects.countries))
        .attr("class", "land")
        .attr("d", path);

    g.append("path")
        .datum(topojson.mesh(world, world.objects.countries, function(a, b) { return a !== b; }))
        .attr("class", "boundary")
        .attr("d", path);
  });

function manageMap() {

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

  t[0] = Math.min(winWidth / 2 * (s - 1), Math.max(winWidth / 2 * (1 - s), t[0]));
  t[1] = Math.min(winHeight / 2 * (s - 1) + 230 * s, Math.max(winHeight / 2 * (1 - s) - 230 * s, t[1]));

  zoom.translate(t);
  g.style("stroke-width", 1/s).attr("transform", "translate(" + t + ")scale(" + s + ")");
  svg.select("g").selectAll("circle")
      .attr("cx", function(d) { return projection([d.lng, d.lat])[0]; })
      .attr("cy", function(d) { return projection([d.lng, d.lat])[1]; })
      .attr("r", 11/s);

}

---

在缩放和转换地图时，有没有简单的方法来获取当前可见区域坐标？我已经在尝试投影地图的翻译，但只是得到一些奇怪的数字。

这样就可以了。我也把它挂在了墙上

即使你已经找到了你的解决方案，这可能对未来的谷歌用户有用

function getScreenBounds() {
  return [getPoint(0,0), getPoint()];
}

function getPoint(x,y) {
  if (x == null) x = winWidth;
  if (y == null) y = winHeight;
  var container = g.node();
  var svg = container.ownerSVGElement || container;
  var point = svg.createSVGPoint();
  point.x = x, point.y = y;
  point = point.matrixTransform(container.getScreenCTM().inverse());
  return formatLocation(projection.invert([point.x, point.y]), zoom.scale());
}

function formatLocation(p, k) {
  var format = d3.format("." + Math.floor(Math.log(k) / 2 - 2) + "f");
  return (p[1] < 0 ? format(-p[1]) + "°S" : format(p[1]) + "°N") + " "
       + (p[0] < 0 ? format(-p[0]) + "°W" : format(p[0]) + "°E");
}

函数getScreenBounds（）{ 返回[getPoint（0,0），getPoint（）]； } 函数getPoint（x，y）{ 如果（x==null）x=winWidth； 如果（y==null）y=winHeight； var container=g.node（）； var svg=container.ownerSVGElement | | container； var point=svg.createSVGPoint（）； 点x=x，点y=y； point=point.matrixTransform（container.getScreenCTM（）.inverse（））； 返回formatLocation（projection.invert（[point.x，point.y]）、zoom.scale（）； } 函数格式化位置（p，k）{ var format=d3.format（“.”+数学层（数学日志（k）/2-2）+“f”）； 返回（p[1]<0？格式（-p[1]）+“S”：格式（p[1]）+“N”）+“” +（p[0]<0？格式（-p[0]）+“W”：格式（p[0]）+“E”）； }

---

您尝试过什么？您应该能够直接从转换计算它，即从最小到（最小+尺寸/比例）。这会给你们屏幕坐标，你们可以用投影把它转换成地图坐标。@Larskothoff对不起，我真的把这些东西弄糊涂了，你们能再给我指一点吗？min是什么？min将是显示的最小坐标，即平移（

t

，在您的代码中）。@Larskothoff我在mapManage的enf中尝试此操作：

t[0]=t[0]+winWidth/s；t[1]=t[1]+winHeight/s；控制台日志（投影反转（t））但输出是，例如，
[272.20426947980627，-81.79887775042842]
。怎么了？这些坐标对我来说没有任何意义。你能发布一个完整的例子吗？