当我们使用 Google Maps API 调用地图时，通常默认会将地图的中心点设置为屏幕的正中间。但是，在某些情况下，我们可能需要取消这个默认的中心点设置，例如需要在地图上标记多个位置时，让该区域全部可见。
本文将介绍如何在 Google Maps API 中取消中心点设置，并提供相应的示例代码和详细步骤。
取消中心点的方法
- 获取地图对象
首先，我们需要获取地图对象。可以通过以下语句来获取：
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 8,
center: {lat: -34.397, lng: 150.644}
});在这里，我们创建了一个变量 map 来存储地图对象，同时指定了 zoom 和中心点的坐标。
- 取消中心点
要取消中心点，我们可以使用 setOptions 方法来设置地图的属性。具体方法如下：
map.setOptions({
center: null,
zoom: 8
});在这里，我们将 center 属性设置为 null，即取消了中心点的设置。同时，我们保留了原来的缩放级别 zoom。
- 标记多个位置
如果需要在地图上标记多个位置，我们可以通过 LatLngBounds 类型来确定地图的显示范围，并调整缩放级别以适应所有标记的位置。具体方法如下：
var bounds = new google.maps.LatLngBounds();
for (var i = 0; i < markers.length; i++) {
bounds.extend(markers[i].getPosition());
}
map.fitBounds(bounds);在这里，我们创建了一个 LatLngBounds 对象 bounds，并通过循环遍历所有标记的位置来扩展该对象。然后，我们使用 fitBounds 方法将地图调整到适应所有标记的位置，并保持原来的缩放级别。
示例代码
以下是一个完整的示例代码，展示了如何在 Google Maps API 中取消中心点设置和标记多个位置。
-- -------------------- ---- -------
--------- -----
------
------
------------- ---- --- ---------------
------- ------------------------------------------------------------------------
--------
--- ----
--- ------- - ---
-------- --------- -
--- - --- ----------------------------------------------- -
----- --
------- ----- -------- ---- --------
---
-- --- -------
--------------- -------- ---- ----------
--------------- -------- ---- ----------
-- --- ------
--- ------ - --- ---------------------------
--- ---- - - -- - - --------------- ---- -
----------------------------------------
-
----------------------
-
-------- ------------------- -
--- ------ - --- --------------------
--------- ---------
---- ---
---
---------------------
-
-------- -------------- -
--- ---- - - -- - - --------------- ---- -
------------------------
-
------- - ---
-
-------- ---------- -
----------------
------- -----
----- -
---
---------------
-
---------
-------
----- -------------------
---- -------- -------------- --------------
------- -------------------------- ------------
-------
-------以上代码演示了如何在地图上添加标记并取消中心点设置。同时，提供了一个 Reset Map 按钮，可以重置地图的状态。
总结
通过本文的介绍，我们学习了如何在 Google Maps API 中取消中心点设置，并提供了相
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/12989
