在使用 Google 地图开发 Web 应用程序时，我们可能需要集成路线方向功能以便用户能够更好地了解如何到达目的地。但是，在默认情况下，Google 地图的路线方向会在起点和终点处添加 A 和 B 标记，这些标记可能会干扰我们的设计和用户体验。
在本文中，我们将介绍如何去除 Google 地图路线方向中的默认 A/B 标记，并提供详细的步骤和示例代码。
步骤 1：创建 Google 地图 API 密钥
要使用 Google 地图 API，我们需要先创建一个 API 密钥。请按照以下步骤操作：
- 前往 Google Cloud Console 并登录您的账户。
- 创建一个新项目并命名它。
- 在左侧菜单栏中选择“API 和服务”>“凭据”。
- 点击“创建凭据”，然后选择“API 密钥”。
- 将新生成的 API 密钥复制保存。
步骤 2：引入 Google 地图 JavaScript API
在您的 HTML 页面中，我们需要引入 Google 地图 JavaScript API。可以通过以下方式实现：
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY"></script>
请将“YOUR_API_KEY”替换为您在步骤 1 中生成的 API 密钥。
步骤 3：创建地图和路线方向
接下来，我们需要创建一个地图并添加路线方向。示例代码如下：
-- -------------------- ---- -------
-------- --------- -
----- ----------------- - --- --------------------------------
----- ------------------ - --- --------------------------------
---------------- ---- -- ----- --- --
---
----- --- - --- ----------------------------------------------- -
----- --
------- - ---- -------- ---- --------- -
---
-------------------------------
----- ------- - -
------- ---- ---------- ----
------------ ---- -------- ----
----------- ------------------------------
--
-------------------------------- ------------------ ------- -
-- ------- --- -------------------------------- -
-------------------------------------------
-
---
-在上述示例中，我们使用 suppressMarkers 属性将默认的 A/B 标记隐藏，然后创建了一个地图和路线方向，并设置起点和终点位置以及旅行模式。
最后，在 directionsService.route() 方法中，我们传递了路线请求和回调函数，该函数将在路线数据下载完成后被调用。在回调函数中，我们检查状态是否为 OK，如果是，则调用 directionsRenderer.setDirections() 方法来显示路线方向。
结论
通过使用上述步骤和示例代码，我们可以轻松地在 Google 地图路线方向中移除默认的 A/B 标记，并改善用户体验。这对于需要集成路线方向功能的 Web 应用程序开发人员来说是非常有用的技巧。
希望本文能够对您有所帮助！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/29409