leaflet - Leaflet.js 将地图集中在一组标记上

Question

我正在使用Leaflet.js并且想要某种方式将地图集中在我拥有的标记上，以便在页面启动时所有内容都在用户的视图中。如果所有标记都聚集在一个小区域中，我希望地图缩小到仍然显示所有标记的级别。

我知道谷歌地图具有自动居中功能，但我将如何使用 Leaflet.js 来解决这个问题？

Answer 1

您可以使用L.LatLngBounds来创建要缩放的区域。

首先，创建一个边界并将一个 L.LatLngs 数组传递给它：

var bounds = new L.LatLngBounds(arrayOfLatLngs);

这将创建一个边界，该边界将封装数组中包含的每个点。一旦有了边界，您就可以调整地图的边界以匹配您创建的边界：

 map.fitBounds(bounds);

这将尽可能放大地图，同时仍包含数组中的每个点。

或者，您也可以fitBounds通过简单地调用该方法并传入一个对象数组来调用该方法L.LatLng。例如：

map.fitBounds([[1,1],[2,2],[3,3]]);

这将功能完全相同，无需创建特定L.LatLngBounds对象。