你当前正在访问 Microsoft Azure Global Edition 技术文档网站。 如果需要访问由世纪互联运营的 Microsoft Azure 中国技术文档网站，请访问 https://docs.azure.cn。

快速入门：使用 Azure Maps 创建交互式搜索地图

本快速入门演示了如何使用 Azure Maps 创建地图，它可以为用户提供交互式搜索体验。 本文演示如何完成以下基本步骤：

• 创建自己的 Azure Maps 帐户。
• 获取要在演示版 Web 应用程序中使用的 Azure Maps 订阅密钥。
• 下载并打开演示版地图应用程序。

本快速入门使用 Azure Maps Web SDK，但 Azure Maps 服务与任何地图控件配合使用，例如这些常用的开源地图控件，Azure Maps 团队已为这些控件创建了插件。

先决条件

• 如果没有 Azure 订阅，请在开始之前创建一个免费帐户。

• 登录 Azure 门户。

创建 Azure Maps 帐户

通过以下步骤创建新的 Azure Maps 帐户：

1. 在 Azure 门户的左上角选择“创建资源”。

2. 在“搜索服务和市场”框中，键入“Azure Maps”。

3. 在显示的下拉列表中选择“Azure Maps”，然后选择“创建”按钮。

4. 在“创建 Azure Maps 帐户资源”页上，输入以下值，然后选择“创建”按钮：

   • 要用于此帐户的订阅。
   • 此帐户的资源组名称。 可以选择新建资源组，也可选择现有资源组。
   • 新 Azure Maps 帐户的名称。
   • 此帐户的定价层 。 选择“Gen2”。
   • 阅读许可证和隐私声明，然后选中复选框接受这些条款。

   

获取帐户的订阅密钥

成功创建 Azure Maps 帐户后，请检索支持你查询 Maps API 的订阅密钥。

1. 在门户中打开 Maps 帐户。
2. 在设置部分中，选择“身份验证” 。
3. 辅助主密钥，并在本地保存它以便稍后在本教程中使用。

注意

本快速入门使用共享密钥身份验证方法进行演示，但适用于所有生产环境的首选方法是使用 [Microsoft Entra ID] 身份验证。

下载并更新 Azure Maps 演示

1. 复制以下文件的内容：Interactive Search Quickstart.html。
2. 在本地将此文件的内容另存为 AzureMapDemo.html。 在文本编辑器中将其打开。
3. 添加在上一部分中获取的主密钥值
   1. 注释掉 authOptions 函数中的所有代码，此代码用于 Microsoft Entra 身份验证。
   2. 取消注释 authOptions 函数中的最后两行，此代码用于共享密钥身份验证，这是本快速入门中使用的方法。
   3. 将 <Your Azure Maps Key> 替换为上一部分中的订阅密钥值。

打开演示版应用程序

1. 在所选的浏览器中打开文件 AzureMapDemo.html。

2. 观察显示的洛杉矶市地图。 进行缩放，查看地图如何自动根据缩放级别呈现更多或更少信息。

3. 更改地图的默认中心。 在“AzureMapDemo.html”文件中，搜索名为“center”的变量 。 将此变量的经度、纬度对值替换为新值“[-74.0060, 40.7128]”。 保存文件并刷新浏览器。

4. 尝试交互式搜索体验。 在演示版 Web 应用程序左上角的搜索框中，搜索“餐厅”。

5. 将鼠标移到搜索框下面显示的地址/位置列表上。 可以看到，地图上的相应图钉会弹出有关该位置的信息。 为保护私营企业的隐私，地图中显示的名称和地址都是虚构的。

   

清理资源

重要

后续步骤部分中列出的教程详细介绍了如何通过帐户使用和配置 Azure Maps。 如何打算继续学习这些教程，请勿清除本快速入门中创建的资源。

如果不打算继续学习这些教程，请通过以下步骤来清理资源：

1. 关闭运行 AzureMapDemo.html Web 应用程序的浏览器。
2. 导航到 Azure 门户。 从门户主页中选择“所有资源”，或者选择左上角的菜单图标，然后选择“所有资源”。
3. 选择 Azure Maps 帐户，然后选择页面顶部的“删除”。

有关更多代码示例和交互式编码体验，请参阅以下文章：

• 使用 Azure Maps 搜索服务查找地址
• 使用 Azure Maps Map Control

后续步骤

在本快速入门中，你创建了 Azure Maps 帐户和演示版应用程序。 请查看以下教程，详细了解 Azure Maps：

使用 Azure Maps 搜索附近兴趣点