在前端开发中，谷歌地图 API V3 是一个强大的工具，它可以帮助我们实现各种地图功能。在这篇文章中，我们将探讨如何在同一地点添加多个标记，并提供示例代码以供参考。
添加单个标记
首先，让我们看看如何在谷歌地图上添加单个标记。以下是一个基本示例代码：
--------- -----
------
------
----------- --- -- - --------------
------- ------------------------------------------------------------------------
--------
-------- ------------ -
--- ---------- - -
------- --- --------------------------- -----------
----- --
--
--- --- - --- ------------------------------------------------------ ------------
--- ------ - --- --------------------
--------- --- --------------------------- -----------
---- ----
------ ---- -----------
---
-
---------------------------------------- ------- ------------
---------
-------
------
---- --------------- ----------------------------
-------
-------在上面的代码中，我们首先使用 google.maps.Map 创建了一个新的地图，并指定了其中心点和缩放级别。然后，我们使用 google.maps.Marker 创建了一个新的标记，并指定其位置和标题，并将其添加到地图上。
添加多个标记
现在，让我们看看如何在同一地点添加多个标记。以下是一个示例代码：
--------- -----
------
------
----------- --- -- - ------------------
------- ------------------------------------------------------------------------
--------
-------- ------------ -
--- ---------- - -
------- --- --------------------------- -----------
----- --
--
--- --- - --- ------------------------------------------------------ ------------
--- --------- - -
- ---- -------- ---- ---------- ------ ---- ---------- --
- ---- -------- ---- ---------- ------ ---- -------- --
- ---- -------- ---- ---------- ------ ---- ------ --
--
--- ---- - - -- - - ----------------- ---- -
--- ------ - --- --------------------
--------- --- ------------------------------------ ------------------
---- ----
------ -------------------
---
-
-
---------------------------------------- ------- ------------
---------
-------
------
---- --------------- ----------------------------
-------
-------在上面的代码中，我们首先创建了一个名为 locations 的数组，其中包含了三个地点的经纬度和标题信息。然后，我们使用 for 循环遍历该数组，并使用 google.maps.Marker 创建了一个新的标记，并将其添加到地图上。
总结
在这篇文章中，我们学习了如何在谷歌地图 API V3 上添加单个标记和多个标记。通过这些示例代码，我们可以更好地理解如何使用谷歌地图 API V3 来实现各种地图功能。希望这篇文章对您有所帮助！
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/11080