Javascript 如何将featurecollection筛选为可与path.bounds（）一起使用的对象

我一直在尝试使用缩放到边界框功能制作地图，基于以下示例：

但对于具有岛屿的市镇，缩放将转到选定地块的边界框，而不是市镇的边界框

我发现在我的数据中，有几个区域被水隔开的城市由多个具有相同名称标签的多边形组成，而不是像上面的Mike Bostocks示例中那样的单个多多边形

我设法解决了填充区域的问题，因此，如果单击其中一个小岛，错误会变得更加明显，但我不知道如何正确地缩放到市政的边界框，而不是陆地区域

我试图寻找不同的方法根据区域名称过滤或子集featurecollection，但我的解决方案最终都给了我一个错误的数据类型，或者一个从-无限到无限的边界框

总之，预期的行为是缩放到高亮显示区域的边界框，而不是选定的地块

这是我目前的地图：

我把变焦速度减慢了一点，这样更容易发现错误，我希望这不会太烦人

这是我怀疑出问题的代码片段

function clicked(d) {

  if (d.properties.KOMNAVN == kommune) return reset();
  d3.selectAll("path")
    .attr("fill", "teal");

  kommune = d.properties.KOMNAVN;

  var bounds = path.bounds(d),
    dx = bounds[1][0] - bounds[0][0],
    dy = bounds[1][1] - bounds[0][1],
    x = (bounds[0][0] + bounds[1][0]) / 2,
    y = (bounds[0][1] + bounds[1][1]) / 2,
    scale = Math.max(1, Math.min(zoomExtent, 0.95 / Math.max(dx / w, dy / h))),
    translate = [w / 2 - scale * x, h / 2 - scale * y];

  svg.transition()
    .duration(4000)
    .call(zoom.transform, d3.zoomIdentity.translate(translate[0], translate[1]).scale(scale));

  d3.selectAll("path").filter(function(d) {
      return d.properties.KOMNAVN == kommune
    })
    .attr("fill", "darkred");

}

提前谢谢

path.bounds

（或

projection.fitSize

和

projection.fitExtent

）为此，需要一个geojson对象，该对象可以是要素集合。向该函数提供数组将导致问题

要素集合如下所示：

{
   "type":"FeatureCollection",
   "features": features
}

其中要素是要素类型的数组

您的数据集有一个要素集合，您可以过滤这些要素：

var filteredFeatures = data.features.filter(function(feature) {
    return feature.properties.property == criteria
})

然后，可以使用这些过滤后的要素创建新要素集合。在您的情况下，这可能看起来像：

  var filteredFeatures = json.features.filter(function(feature) {
    return feature.properties.KOMNAVN == d.properties.KOMNAVN;
  })

  var filteredFeatureCollection = {
    "type":"FeatureCollection",
    "features":filteredFeatures
  }

不，您可以将此新要素集合发送到path.bounds

请注意，对于您的示例，我已经将click函数移到了d3.json的callback函数中，以便

json

变量的范围涵盖click函数

---

这是一个

非常感谢，解决方案是否像我希望的那样简单？至于最后一位，移动click函数的原因是什么？

json

变量范围没有扩展到click函数，因为

json

仅在回调函数中定义。不移动函数会导致错误，说明未定义

json

。有其他的方法来处理这个问题，但这是最简单的。好吧，我想我必须稍微考虑一下，再次感谢你的洞察力。