Question

这与之前的问题有关：Leafletjs dynamically bound map to visible overlays。

我现在正在使用带有Leaflet.FeatureGroup.SubGroup插件的Leaflet.markercluster插件。尝试将地图绑定到所有可见标记和标记簇。我正在使用3个坐标进行测试：

[43.6425657, -79.38705569999999]
[43.7164673, -79.3395846]
[-41.3142772, 174.8135975]

这是到目前为止的代码：

var map = L.map("mapid");
L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png").addTo(map);

map.setView([43.6532, -79.3832], 2);

var parentGroup = L.markerClusterGroup().addTo(map),
    consultingMarkers = L.featureGroup.subGroup(parentGroup).addTo(map),
    otherMarkers = L.featureGroup.subGroup(parentGroup).addTo(map);

// subGroup1
L.marker([43.6425657, -79.38705569999999]).addTo(consultingMarkers);
L.marker([43.7164673, -79.3395846]).addTo(consultingMarkers);

// subGroup2 
L.marker([-41.3142772, 174.8135975], {icon: otherIcon}).addTo(otherMarkers);

var overlays = {
  'consulting': consultingMarkers,
  'other': otherMarkers
};

L.control.layers(null, overlays, {
  collapsed: false
}).addTo(map);

map.on('overlayadd overlayremove', function () {
  var bounds = parentGroup.getBounds(),
      southWest = bounds.getSouthWest();

  // Fit bounds only if the Parent Group actually has some markers,
  // i.e. it returns valid bounds.
  if (southWest && !southWest.equals(bounds.getNorthEast())) {
    map.fitBounds(parentGroup.getBounds());
  }
});

到目前为止，我遇到了这些问题：

地图不受[-41.3142772,174.8135975]坐标的约束
取消检查＆＃34;咨询＆＃34;图层不会将地图绑定到＆＃34;其他＆＃34;具有坐标的层[-41.3142772,174.8135975]。

更新：它似乎对单个标记有这个边界问题。我尝试添加另一个标记坐标[43.76089289999999，-79.4103427]，它将在群集中。但如果我删除＆＃34;咨询＆＃34;群集并删除＆＃34;其他＆＃34;层。地图仍未绑定到地图上剩余的最后一个标记。

Answer 1

如果我理解正确，你会感到困惑，因为当你的一个子组只有一个标记时，map.fitBounds看起来不会被执行？

在这种情况下，这只是!southWest.equals(bounds.getNorthEast())检查的预期行为：它避免在bounds表示空区域时执行下一个块，即其中有0或1个标记。 / p>

通过用bounds.isValid()替换检查，你只能避免有0标记的情况，但是如果只有1个标记，它将允许执行下一个块，因此试图在零区。在这种情况下，Leaflet将平移到该单个标记并缩放到maxZoom。

map.on('overlayadd overlayremove', function () {
  var bounds = parentGroup.getBounds();

  if (bounds.isValid()) {
    map.fitBounds(bounds);
  }
});

演示：https://jsfiddle.net/3v7hd2vx/355/

Leafletjs动态绑定到可见标记/簇

1 个答案: