在使用 Google 地图 API 时，有时需要在地图上显示多个标记（Markers），而这些标记可能分布在不同的区域。为了确保所有标记都能够完整地显示在地图中，我们需要调整地图的缩放级别。
缩放级别与地图范围的关系
Google 地图的缩放级别是一个数字，通常从 0 开始，逐渐增大表示地图的缩放比例越来越大。例如，缩放级别为 0 表示世界地图，缩放级别为 20 表示非常接近的街景。
当然，缩放级别并不是唯一决定地图范围的因素，还有地图的中心点、地图类型等因素也会影响地图的范围。
计算地图范围
为了确定应该设置的缩放级别，我们需要计算所有标记所在的位置的边界，即地图范围。这可以通过遍历所有标记，并记录它们的经纬度坐标，然后找到最小和最大值来实现。
以下是一个示例函数，用于计算标记集合的地理边界：
function getBounds(markers) {
const bounds = new google.maps.LatLngBounds();
for (let i = 0; i < markers.length; i++) {
bounds.extend(markers[i].getPosition());
}
return bounds;
}这个函数接收一个标记集合参数 markers，并返回一个 google.maps.LatLngBounds 对象表示所有标记的地图范围。
调整缩放级别
有了地图的范围之后，我们就可以计算应该设置的缩放级别了。这可以通过调用 google.maps.Map.fitBounds() 方法来实现。该方法会根据提供的地理边界值自动调整地图的中心点和缩放级别。
以下是一个示例函数，用于将地图调整到包含所有标记的最佳缩放级别：
function fitMarkers(map, markers) {
const bounds = getBounds(markers);
map.fitBounds(bounds);
}这个函数接收两个参数：map 表示要调整的 Google 地图对象，markers 表示要显示的标记集合。
在 Google 地图上显示多个标记
最后，我们还需要知道如何在 Google 地图上显示多个标记。这可以通过创建 google.maps.Marker 对象，并将其添加到地图上来实现。
以下是一个示例函数，用于在指定位置上创建一个标记，并将其添加到地图上：
function createMarker(map, position) {
const marker = new google.maps.Marker({
position: position,
map: map,
});
return marker;
}这个函数接收两个参数：map 表示要添加标记的 Google 地图对象，position 表示标记的经纬度坐标。
总结
在使用 Google 地图 API 时，我们需要确保所有标记都能完整地显示在地图中。为了实现这一目标，我们可以计算所有标记的地理边界，并调用 google.maps.Map.fitBounds() 方法来调整地图的缩放级别和中心点。同时，我们也需要知道如何在 Google 地图上显示多个标记，这可以通过创建 google.maps.Marker 对象并将其添加到地图上来实现。
完整示例代码如下：
-- -------------------- ---- -------
-------- ------------------ -
----- ------ - --- ---------------------------
--- ---- - - -- - - --------------- ---- -
----------------------------------------
-
------ -------
-
-------- --------------- -------- -
----- ------
- ----------------------------------------------------------- --------
----------------------------------------------------------------------------------