Maps Embed API 快速入门

通过简单的 HTTP 请求在您的网页上放置交互式地图或街景全景图，无需使用 JavaScript。

费用

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

准备工作

如需在网页上创建嵌入式地图，请依次点击以下标签页，完成所需的设置步骤：

第 1 步

控制台

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

    转到项目选择器页面

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

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

Cloud SDK

gcloud projects create "PROJECT"

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

第 2 步

如要使用 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 密钥，请执行以下操作：

控制台

  1. 前往 Google Maps Platform > 凭据页面。

    前往“凭据”页面

  2. 在凭据页面上，依次点击创建凭据 > API 密钥。
    已创建的 API 密钥对话框会显示您新创建的 API 密钥。
  3. 点击关闭。
    新的 API 密钥即会列在凭据页面的 API 密钥下。
    （在生产环境中使用 API 密钥之前，请务必对 API 密钥设置限制。）

Cloud SDK

gcloud alpha services api-keys create \
    --project "PROJECT" \
    --display-name "DISPLAY_NAME"

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

生成 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，然后点击关停以删除项目。

后续步骤