d3：缩放到国家而不是州的边界框 II答案

【问题标题】：d3: Zoom to Bounding Box II for countries instead of statesd3：缩放到国家而不是州的边界框 II
【发布时间】：2016-05-03 17:14:01
【问题描述】：

我正在尝试让 d3 Zoom to Bounding Box II 示例（请参阅此处：https://bl.ocks.org/mbostock/raw/9656675/）为世界地图而不是美国各州地图工作。不幸的是，缩放不稳定。对于某些国家/地区，它运行良好；对于其他人来说，它会放大到太平洋。

我无法从远程位置加载 topojson 文件，因此我会 JSFiddle 我的代码。我在上面的例子中编辑的相关函数如下：

var projection = d3.geo.mercator() // instead of albersUsa
    .scale(100)
    .translate([width / 2, height / 2]);

d3.json("world-110m.json", function(error, world) { //world json
  if (error) throw error;

  g.selectAll("path")
    .data(topojson.feature(world, world.objects.countries).features) //traverse world objects instead of state objects
    .enter().append("path")
  .attr("d", path)
  .attr("class", "feature")
  .on("click", clicked);

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

任何帮助表示赞赏。

注意：我刚刚意识到缩放在某些州也是不稳定的。例如，尝试单击 VT 或 NH。我将在 GitHub 上提交一个错误。同时有什么想法吗？

【问题讨论】：

它可能来自您的“world-110m.json”版本吗？我在这里用我的世界 json 版本重新创建了你的地图，它似乎运行良好。您遇到问题的任何特定国家/地区？ plnkr.co/edit/L4U1fRXq9wre1DrigkLJ?p=preview你可以从plunk下载世界地图。
你能解决这个问题吗？
我应该早点更新。我在 Git 上发布了一个问题，Mike Bostock 在几个小时内发布了一个修复：github.com/mbostock/d3/issues/2819。原来我正在运行一个（稍微）过时的 d3 版本。那和他修改了边界变量中的比例。在上面的链接中查看他的回复。

标签： d3.js topojson

【解决方案1】：

我认为回答我自己的问题（即使我不是解决问题的人）是犹太教。

Mike Bostock 说我正在运行一个稍微过时的 d3 版本。至少运行 D3 3.5.7，然后更新 bounds var：

scale = Math.max(1, Math.min(8, 0.9 / Math.max(dx / width, dy / height)))

他也在他的网站上修复了这些示例。

【讨论】：