Guida introduttiva: Creare una mappa di ricerca interattiva con Mappe di Azure

Questa guida introduttiva illustra come usare Mappe di Azure per creare una mappa che offre agli utenti un'esperienza di ricerca interattiva. L'articolo descrive le operazioni di base seguenti:

• Creare un proprio account di Mappe di Azure.
• Ottenere la chiave di sottoscrizione Mappe di Azure da usare nell'applicazione Web demo.
• Scaricare e aprire l'applicazione demo per le mappe.

Questa guida introduttiva usa l'SDK Web di Mappe di Azure, ma il servizio Mappe di Azure può essere usato con qualsiasi controllo mappa, ad esempio questi controlli comuni della mappa open source per cui il team Mappe di Azure ha creato il plug-in.

Prerequisiti

• Se non si ha una sottoscrizione di Azure, creare un account gratuito prima di iniziare.

• Accedi al portale di Azure.

Creare un account di Mappe di Azure

Creare un account di Mappe di Azure eseguendo questa procedura:

1. Selezionare Crea una risorsa nell'angolo superiore sinistro della portale di Azure.

2. Digitare Mappe di Azure nella casella servizio di ricerca e Marketplace.

3. Selezionare Mappe di Azure nell'elenco a discesa visualizzato, quindi selezionare il pulsante Crea.

4. Nella pagina Crea una risorsa account Mappe di Azure immettere i valori seguenti e quindi selezionare il pulsante Crea:

   • La sottoscrizione da usare per l'account.
   • Il nome del gruppo di risorse per l'account. È possibile scegliere Crea nuovo o Selezionare un gruppo di risorse esistente .
   • Nome del nuovo account Mappe di Azure.
   • Piano tariffario dell'account. Selezionare Gen2.
   • Leggere l'Informativa sulla licenza e la privacy, quindi selezionare la casella di controllo per accettare le condizioni.

   

Ottenere la chiave di sottoscrizione per l'account

Dopo aver creato correttamente l'account Mappe di Azure, recuperare la chiave di sottoscrizione che consente di eseguire query sulle API Mappe.

1. Aprire l'account di Mappe nel portale.
2. Nella sezione delle impostazioni selezionare Autenticazione.
3. Copiare la chiave primaria e salvarla in locale per usarla più avanti in questa esercitazione.

Scaricare e aggiornare la demo Mappe di Azure

1. Copiare il contenuto del file: Interactive Search Quickstart.html.
2. Salvare il contenuto del file in locale come AzureMapDemo.html. Aprirlo in un editor di testo.
3. Aggiungere il valore chiave primaria ottenuto nella sezione precedente
   1. Impostare come commento tutto il codice nella authOptions funzione, questo codice viene usato per l'autenticazione di Microsoft Entra.
   2. Rimuovere il commento dalle ultime due righe della authOptions funzione, questo codice viene usato per l'autenticazione con chiave condivisa, l'approccio usato in questa guida introduttiva.
   3. Sostituire <Your Azure Maps Key> con il valore della chiave di sottoscrizione della sezione precedente.

Aprire l'applicazione demo

1. Aprire il file AzureMapDemo.html nel browser che si preferisce.

2. Osservare la mappa visualizzata della città di Los Angeles. Fare zoom avanti e indietro per osservare come la mappa esegue automaticamente il rendering con più o meno informazioni a seconda del livello di zoom.

3. Modificare il centro predefinito della mappa. Nel file AzureMapDemo.html cercare la variabile denominata center. Sostituire il valore della coppia longitudine, latitudine di questa variabile con i nuovi valori [-74,0060, 40,7128]. Salvare il file e aggiornare il browser.

4. Provare l'esperienza di ricerca interattiva. Nella casella di ricerca nell'angolo in alto a sinistra dell'applicazione Web demo cercare restaurants.

5. Spostare il puntatore del mouse sull'elenco di indirizzi e posizioni visualizzato sotto la casella di ricerca. Osservare che l'indicatore corrispondente sulla mappa visualizza le informazioni sulla posizione corrispondente. Per la privacy delle aziende private, sono visualizzati nomi e indirizzi fittizi.

   

Pulire le risorse

Se non si intende continuare con le esercitazioni, pulire le risorse eseguendo questa procedura:

1. Chiudere il browser che esegue l'applicazione Web AzureMapDemo.html.
2. Passare al portale di Azure. Selezionare Tutte le risorse nella pagina principale del portale oppure selezionare l'icona del menu nell'angolo in alto a sinistra e quindi Tutte le risorse.
3. Selezionare l'account Mappe di Azure, quindi selezionare Elimina nella parte superiore della pagina.

Per altri esempi di codice e un'esperienza di codifica interattiva, vedere questi articoli:

• Trovare un indirizzo usando il servizio di ricerca di Mappe di Azure
• Usare il controllo mappa di Mappe di Azure

Passaggi successivi

In questa guida introduttiva sono stati creati un account Mappe di Azure e un'applicazione demo. Per altre informazioni su Mappe di Azure, esaminare queste esercitazioni: