HTML and CSS Reference
In-Depth Information
Add a new function to the latLongApp.js file. This function places a remote call to the Bing service,
passing coordinates and getting back detailed civic address information. The URL to call has the
following format:
http://dev.virtualearth.net/REST/v1/Locations/lat,long?o=json&key=...
To invoke the URL, use the WinJS.xhr object you first discovered in Chapter 11, “Working with
remote data.” Here's the code that converts coordinates to an address:
latLongApp.convertToAddress = function (location) {
var url = "http://dev.virtualearth.net/REST/v1/Locations/" +
location.latitude +
"," +
location.longitude +
"?o=json&key=" +
latLongApp.BingKey;
// Invoke the Bing service
WinJS.xhr({ url: url }).then(function (response) {
var data = JSON.parse(response.responseText);
var address = data.resourceSets[0].resources[0].name;
// Prepare an info-box to add to the map
var infoboxOptions = { zIndex: 3, title: address };
var defaultInfobox = new Microsoft.Maps.Infobox(location, infoboxOptions);
latLongApp.map.entities.push(defaultInfobox);
});
}
The Bing service returns a complex JSON string that, after it's parsed to a JavaScript object, stores
the full address to the name property.
var address = data.resourceSets[0].resources[0].name;
You can display the address in a number of ways. For example, you could display it as plain text in
the page. Alternatively, you can create an info-box that displays on the map close to the pushpin.
To call the Bing service, you need only the user's latitude and longitude (plus, obviously, your Bing
key), so you can call the convertToAddress function at any time. In the sample application, however,
you might want to place the following call just after the call that adds the pushpin.
latLongApp.display = function (location) {
...
latLongApp.addPushPin(mapCenter);
latLongApp.convertToAddress(mapCenter);
}
Search WWH ::




Custom Search