Maps Embed API 快速入门

通过 HTTP 请求在网页上放置交互式地图或街景全景图片，无需自定义 JavaScript。

费用

所有 Maps Embed API 请求都可免费使用，且用量不受限制。不过，所有请求仍需提供有效的 Google Cloud API 密钥。如需了解详情，请参阅用量和结算。

准备工作

如需在网页上创建嵌入式地图，请完成以下必需的设置步骤：

第 1 步：设置项目

控制台

  1. 在 Google Cloud 控制台中，打开项目选择器页面，点击创建项目以开始创建新的 Cloud 项目。

    转到项目选择器页面

  2. 确保您的 Cloud 项目已启用结算功能。确认您的项目已启用结算功能。

    Google Cloud 提供免费试用。试用期将在 90 天后或者账号费用累积达到 300 美元时（以先到者为准）结束。您随时可以取消试用。如需了解详情，请参阅结算账号赠金和结算。

Cloud SDK

gcloud projects create "PROJECT"

详细了解 Google Cloud SDK、Cloud SDK 安装和以下命令：

第 2 步：启用 API 或 SDK

如要使用 Google Maps Platform，您必须启用计划用于项目的 API 或 SDK。

控制台

启用 Maps Embed API

Cloud SDK

gcloud services enable \
    --project "PROJECT" \
    "maps-embed-backend.googleapis.com"

详细了解 Google Cloud SDK、Cloud SDK 安装和以下命令：

第 3 步：获取 API 密钥

此步骤仅包含 API 密钥的创建流程。如要在生产环境中使用 API 密钥，强烈建议您为相应密钥设置限制。如需了解详情，请参阅相应产品的使用 API 密钥页面。

API 密钥是唯一标识符，用于对与您的项目相关联的请求进行身份验证，以便您使用相关产品和执行结算。您必须至少有一个与您项目相关联的 API 密钥。 如需创建新密钥或向现有密钥添加 API 或 SDK，请按照以下说明操作。

控制台

  1. 前往 Google Maps Platform > 密钥和凭证页面。

    前往“密钥和凭证”页面

  2. 如果出现提示，请选择您的项目。

  3. 执行以下其中一项操作：

    • 创建新密钥：

      1. 点击创建凭据 > API 密钥。
      2. 在创建 API 密钥面板中，打开选择 API 限制列表。
      3. 清除此密钥不需要的所有 API，并确保 Maps Embed API 保持选中状态。
      4. 点击创建。该面板会显示您的新 API 密钥。

    • 使用现有密钥：

      1. 点击密钥的名称。
      2. 在选择 API 限制列表中，选择 Maps Embed API。
      3. 点击保存。

    在此处选择 API 并不会启用它。确保在 Maps Embed API 的 API 库页面上启用了该 API。

  4. 如需稍后查看密钥字符串，请前往密钥和凭证页面，然后点击相应密钥的显示密钥。

如果控制台与这些步骤不同，请参阅 Google Cloud 文档中的创建 API 密钥和添加 API 限制。

Cloud SDK

在以下命令中，将 PROJECT_ID 替换为您的项目 ID。

  • 创建新密钥：运行以下命令，并将 DISPLAY_NAME 替换为密钥的名称。

    gcloud services api-keys create \
    --project="PROJECT_ID" \
    --display-name="DISPLAY_NAME" \
    --api-target=service=maps-embed-backend.googleapis.com

    详细了解 Google Cloud SDK、Cloud SDK 安装和以下命令：

  • 使用现有密钥：运行以下命令，并将 KEY_ID 替换为密钥的 ID。--append 标志会保留密钥已允许的 API。如果不使用此参数，该命令会替换这些标签。

    gcloud services api-keys update KEY_ID \
    --project="PROJECT_ID" \
    --append \
    --api-target=service=maps-embed-backend.googleapis.com

    详细了解 Google Cloud SDK、Cloud SDK 安装和以下命令：

    键 ID 不是键字符串或显示名称。如需查找该 ID，请运行 gcloud services api-keys list --project="PROJECT_ID"。 该 ID 是 name 字段的最后一部分：projects/PROJECT_NUMBER/locations/global/keys/KEY_ID。

如需查看密钥字符串，请运行 gcloud services api-keys get-key-string KEY_ID --project="PROJECT_ID"。

正在生成 iframe

点击以下选项，然后添加地点和 API 密钥，即可为您的网页生成 iframe。如需了解其他参数和选项，请参阅嵌入地图。

测试 iframe

如需在 HTML 浏览器窗口中查看 iframe，请执行以下操作：

  1. 打开默认文本编辑器。您的设备上应该默认安装了文本编辑器，例如TextEdit或 Microsoft Windows 记事本。
  2. 创建一个 HTML 文件，并将其命名为 index.html。

  3. 添加以下代码以及您在上面生成的 iframe：

    <html>
  <!-- Replace this code comment with your iframe. -->
</html>

  4. 保存 index.html HTML 文件。

  5. 将该 HTML 文件从桌面拖放到网络浏览器上进行加载；在大多数操作系统上，也可双击该文件进行加载。

恭喜！您刚刚使用 Maps Embed API 设置并构建了地图。

清理

您可以删除 Google Cloud 项目，以停止对该项目中使用的所有资源计费。

  1. 在 Google Cloud 控制台中，转到管理资源页面：

    转到“管理资源”页面

  2. 如果您打算删除的项目已附加到某个组织，请选择并展开页面顶部的组织列表。
  3. 在项目列表中，选择要删除的项目，然后点击删除。
  4. 在对话框中输入项目 ID，然后点击关停以删除项目。

后续步骤