leaflet getBounds（）errors

Question

我正在尝试将动态添加标记的边界添加到地图中。我的目标是动态地将标记添加到地图并让视图自动缩放以适合地图上所有标记的边界。以下是我目前的代码和迄今为止我尝试过的内容：

起点是一个lat＆amp;数组。 LNG：

网页提供了用户可以选择和取消选择的地址和复选框列表。当选择了所需的地址时，用户可以点击地图上的视图，makrers将出现在地图上（这是完美的，我只是不能让视图缩放到这些标记的边界）

我有一个循环，它为每个检查过的地址拉取lat和lng并将其推送到这样的数组中：

latLng.push(42.9570316,-86.04564429999999);
latLng.push(43.009381,-85.890041);

...这是一个循环，所以它总是包含所需数量的值并输出：

latLng = [42.9570316,-86.04564429999999,43.009381,-85.890041,43.11996200000001,-85.42854699999998,43.153376,-85.4730639,42.8976947,-85.88893200000001];

var thisLatLng = L.latLng(latLng);

console.log(thisLatLng); // this returns Null

mymap.fitBounds(group); //  returns Error: Bounds are not Valid

mymap.fitBounds(group.getBounds()); // returns group.getBounds() is not a function

我也尝试过这个作为起点：

latlng.push(L.marker([42.9570316,-86.04564429999999]));
latlng.push(L.marker([43.009381,-85.890041]));

...这包含在一个循环中，导致输出

latLng = [L.marker([42.9570316,-86.04564429999999]),L.marker([43.009381,-85.890041]),L.marker([43.11996200000001,-85.42854699999998]),L.marker([43.153376,-85.4730639]),L.marker([42.8976947,-85.88893200000001])];

console.log(latLng); // this returns makrers with the correct lat & lng above

var group = new L.featureGroup(latLng);

console.log(group); //this returns a Null featureGroup

mymap.fitBounds(group); // returns Error: Bounds are not valid

mymap.fitBounds(group.getBounds()); // returns Error: Bounds are not valid

我对如何完成这项工作感到茫然我已尝试在stackoverflow上发布了几个答案，并试图尝试按照文档但似乎没有任何结果给出了预期的结果。

更新

我删除了latLng.push(L.marker([42.9570316,-86.04564429999999]));循环并替换为以下内容：

我创建了一个带有var group = new L.featureGroup();的功能组，然后使用marker.addTo(group);在循环中为其添加了标记，这会将所有标记推送到功能组中，正如我所料，但无法获得边界。

mymap.fitBounds(group.getBounds()); // returns Error: Bounds are not valid

这是console.log(group);输出：

Answer 1

我完全没想到

latLng = [L.marker([42.9570316,-86.04564429999999]),L.marker([43.009381,-85.890041]),L.marker([43.11996200000001,-85.42854699999998]),L.marker([43.153376,-85.4730639]),L.marker([42.8976947,-85.88893200000001])];

可以工作。在传单中，您不能只创建一个变量并说它是一个标记对象。您需要使用L.marker()

之类的方法

您需要做的是创建一个标记并将其添加到featureGroup

var group = new L.featureGroup();
for (var i = 0; i < yourMarkers.length; i++) {
    L.marker([51.5, -0.09]).addTo(group);
}
map.fitBounds(group.getBounds());

group现在将包含多个标记。

你也可以试试这个：

var coordinates = new Array();
for (var i = 0; i < yourMarkers.length; i++) {
    var marker = L.marker([51.5, -0.09]);
    coordinates.push(marker);
}
var group = new L.featureGroup(coordinates);
map.fitBounds(group.getBounds());

<强>更新

有关的功能就是这个：

function showResult(lat, lng) { 
    var marker = L.marker([lat, lng]) 
    .bindPopup('yourPopup').on("popupopen", onPopupOpen).addTo(group); 
    map.addLayer(group); 
    map.fitBounds(group.getBounds()); 
}

您只需在其中添加fitBounds()。