自动缩放地图以适合所有标记答案

【问题标题】：Automatically Zoom the map to fit all markers自动缩放地图以适合所有标记
【发布时间】：2015-09-30 08:18:29
【问题描述】：

下面一个例子，你可以看到她http://plnkr.co/edit/lJHyP3dhT3v8aHVdt3D3?p=preview的plunker

无论在初始化地图时提供什么缩放值，我都想自动缩放地图，以便所有标记都在视图内。这是我的代码

var tiles = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
        maxZoom: 18,
        attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors, Points &copy 2012 LINZ'
    }),
    latlng = L.latLng(-37.82, 175.24);

var map = L.map('map', {center: latlng, zoom: 10, layers: [tiles]});

var markers = L.markerClusterGroup();

for (var i = 0; i < addressPoints.length; i++) {
    var a = addressPoints[i];
    var title = a[2];
    var marker = L.marker(new L.LatLng(a[0], a[1]), { title: title });
    marker.bindPopup(title);
    markers.addLayer(marker);
}

map.addLayer(markers);

var group = new L.featureGroup(markers);

map.fitBounds(group.getBounds());

【问题讨论】：

标签： leaflet markerclusterer

【解决方案1】：

你需要

创建数组
将所有标记推入数组
将所有标记添加到数组后，创建一个featureGroup
将您的标记数组添加到featureGroup，然后缩放到其边界。

以下是修改后的代码

var markerArray = []; //create new markers array

for (var i = 0; i < addressPoints.length; i++) {
    var a = addressPoints[i];
    var title = a[2];
    var marker = L.marker(new L.LatLng(a[0], a[1]), { title: title });
    marker.bindPopup(title);
    markers.addLayer(marker);

    markerArray.push(marker); //add each markers to array

    if(i==addressPoints.length-1){//this is the case when all the markers would be added to array
        var group = L.featureGroup(markerArray); //add markers array to featureGroup
        map.fitBounds(group.getBounds());   
    }
}

这是工作的plunk

【讨论】：