Nello script #104 abbiamo visto come sfruttare le api di geolocalizzazione di HTML5 per ottenere la posizione dell'utente. La posizione viene fornita in formato latitudine/longitudine che è perfetto quando dobbiamo lavorare con le mappe, ma inutile se dobbiamo anche mostrare all'utente informazioni sull'indirizzo in cui si trova.
Per ottenere tutte le informazioni sull'indirizzo civico corrispondente a una latitudine/longitudine possiamo usare i servizi REST di Bing. Essendo REST, questi servizi possono essere invocati da JavaScript ma, essendo su un altro dominio, dobbiamo utilizzare JSONP per ottenere i risultati.
L'esempio che segue mostra il codice necessario ad invocare i servizi REST di Bing.
<html> <head> <script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-2.0.1.js"></script> <script type="text/javascript"> $(document).ready(function () { $.ajax({ url: "http://dev.virtualearth.net/REST/v1/Locations/47.64054,-122.12934", dataType: "jsonp", data: { key: "<BingMapsKey>", }, jsonp: "jsonp", success: function (data) { $("#searchResult").append( data.resourceSets[0].resources[0].address.formattedAddress ); } }); }); </script> </head> <body> <div id="searchResult" > </div> </body> </html>
La prima cosa da notare nello script è l'URL invocato. L'ultima parte dell'URL contiene la latitudine e la longitudine (separati da virgola (,) e con il punto (.) come separatore decimale) del punto di cui si vuole trovare l'indirizzo. Come seconda cosa da notare c'è il fatto che come parametro passiamo la BingMapsKey. Questa è obbligatoria e va ottenuta attraverso il pannello di controllo di Bing. Infine, il codice nel callback "success" mostra come ottenere l'indirizzo completo formattato come stringa, ma ci sono anche i singoli campi come la città, l'indirizzo, lo stato e così via.
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Limitare le richieste lato server con l'interactive routing di Blazor 8
Gestire undefined e partial nelle reactive forms di Angular
Aggiungere interattività lato server in Blazor 8
Eseguire attività pianificate con Azure Container Jobs
Ottimizzare il mapping di liste di tipi semplici con Entity Framework Core
Eseguire query verso tipi non mappati in Entity Framework Core
Eseguire attività con Azure Container Jobs
Creazione di plugin per Tailwind CSS: espandere le Funzionalità del Framework
Migrare una service connection a workload identity federation in Azure DevOps
Reactive form tipizzati con FormBuilder in Angular
Utilizzare i primary constructor di C# per inizializzare le proprietà
Filtrare e rimuovere gli elementi dalla cache del browser tramite le API JavaScript