Quickstart: Crie um mapa de pesquisa interativo com o Azure Maps

Este quickstart demonstra como usar o Azure Maps para criar um mapa que oferece aos utilizadores uma experiência de pesquisa interativa. Ele guia-o por estes passos básicos:

• Crie a sua própria conta Azure Maps.
• Obtenha a sua chave de subscrição Azure Maps para usar na aplicação web de demonstração.
• Descarregue e abra a aplicação do mapa demo.

Prerequisites

• Se não tiver uma subscrição do Azure, crie uma conta gratuita antes de começar.

• Inicie sessão no portal Azure.

Criar uma conta do Azure Maps

Crie uma nova conta Azure Maps com os seguintes passos:

1. Selecione Criar um recurso no canto superior esquerdo do portal Azure.

2. Escreva Azure Maps na caixa de serviços de pesquisa e Marketplace .

3. Selecione Azure Maps na lista suspensa que aparece, e selecione o botão Criar.

4. Na página de recurso Criar uma Conta Azure Maps, introduza os seguintes valores e, em seguida, selecione o botão Criar.

   • A Subscrição que deseja utilizar para esta conta.
   • O nome do grupo de recursos para esta conta. Pode optar por criar um novo grupo de recursos ou selecionar o grupo de recursos existente .
   • O nome da sua nova conta Azure Maps.
   • O escalão de preços para esta conta. Selecione Gen2.
   • Leia a Licença e a Declaração de Privacidade, depois selecione a caixa para aceitar os termos.

   

Obtenha a chave de subscrição para a sua conta

Depois de criar com sucesso a sua conta Azure Maps, recupere a chave de subscrição que lhe permite consultar as APIs do Maps.

1. Abra a sua conta Maps no portal.
2. Na secção de definições, selecione Autenticação.
3. Copie a Chave Primária e guarde-a localmente para usar mais tarde neste tutorial.

Descarregue e atualize a demo do Azure Maps

1. Copie o conteúdo do ficheiro: Pesquisa Interativa Quickstart.html.
2. Guarde o conteúdo deste ficheiro localmente como AzureMapDemo.html. Abra-o num editor de texto.
3. Adicione o valor da Chave Primária que obteve na secção anterior
   1. Comenta todo o código da authOptions função, este código é usado para autenticação Microsoft Entra.
   2. Descomente as duas últimas linhas na função authOptions, este código é usado para autenticação de Chave Partilhada, a abordagem a ser usada neste início rápido.
   3. Substitua <Your Azure Maps Key> pelo valor da chave de subscrição da secção anterior.

Abra a aplicação de demonstração

1. Abre o ficheiroAzureMapDemo.html num navegador à tua escolha.

2. Observe o mapa mostrado da cidade de Los Angeles. Faça zoom in e out para ver como o mapa renderiza automaticamente com mais ou menos informação dependendo do nível de zoom.

3. Muda o centro padrão do mapa. No ficheiroAzureMapDemo.html , procure a variável chamada center. Substitua o valor do par de longitude e latitude desta variável pelos novos valores [-74.0060, 40.7128]. Guarde o ficheiro e atualize o browser.

4. Experimenta a experiência de pesquisa interativa. Na caixa de pesquisa no canto superior esquerdo da aplicação web de demonstração, pesquise por restaurantes.

5. Mova o rato pela lista de endereços e locais que aparecem abaixo da caixa de pesquisa. Repare como o alfinete correspondente no mapa revela informações sobre esse local. Para a privacidade dos negócios privados, são apresentados nomes e moradas fictícios.

   

Limpeza de recursos

Se não planeias continuar com os tutoriais, segue estes passos para limpar os recursos:

1. Fecha o navegador que executa a AzureMapDemo.html aplicação web.
2. Navegue para o portal do Azure. Selecione Todos os recursos na página principal do portal, ou selecione o ícone do menu no canto superior esquerdo e depois Todos os recursos.
3. Selecione a sua conta Azure Maps e depois selecione Eliminar no topo da página.

Para mais exemplos de código e uma experiência interativa de programação, consulte estes artigos:

• Encontre um endereço com o serviço Azure Maps Search
• Usar o Controle de Mapa do Azure Maps

Próximos passos

Neste quickstart, criaste uma conta Azure Maps e uma aplicação de demonstração. Consulte os seguintes tutoriais para saber mais sobre o Azure Maps: