Summary
JavaScript code that discovers the latitude and longuitude of a user visiting a web page and centers a map around it.
Summary of Steps
- Copy the template code and paste it into your application.
- Invoke GoToUserLocation() from your application.
Notes :
GoToUserLocation should be called after the Virtual Earth mapping control has loaded
Replace the 'map' object name on SetAutoLocateViewport by the name of the map object in your application.
How the code works:
The JavaScript code consist of three functions:
- GoToUserLocation(): Invokes the remote Virtual Earth WiFi service by:
- Dynamically creating an HTML <script> tag
- Setting the 'src' (source) property of the <script> tag to the Virtual Earth WiFi service URL
- Appending the <script> tag to the page DOM tree. By appending the <script> element, we force the execution of the code pointed by the 'src' property, in this case the Virtual Earth WiFi service.
- SetAutoLocateViewport(latitude, longitude, lvl, bl, msg): Centers the map around the latitude and longitude parameters passed to it. The Virtual Earth WiFi service invokes this function passing the user latitude, and longitude as first two parameters.
- ShowMessage(msg): Displays an error message. The Virtual Earth WiFi service calls this function if it can't find the user location.
Template Code
// WiFiLocator.js
// --------------
// Finds current user latitude and longitude location using Virtual Earth's WiFi location service
//
// URL of Virtual Earth's location service
var WiFiLocatorUrl = " http://virtualearth.msn.com/WiFiIPService/locate.ashx "
// GoToUserLocation() invokes the remote Virtual Earth WiFi service by
// dynamically creating a <script> tag that points to the URL of the WiFi service
function GoToUserLocation()
{
// Dynamically create <script> tag
oScript = document.createElement("script");
// Set the 'src' property of the <script> tag to the URL of the Virtual Earth WiFi service
oScript.setAttribute("src", WiFiLocatorUrl);
// Append the <script> tag to the HTML page DOM tree.
// This forces the execution of the remote script pointed by the 'src' property,
// in this case, the Virtual Earth WiFi service.
head = document.getElementsByTagName("head").item(0);
head.appendChild(oScript);
}
// SetAutoLocateViewport() centers the map to the latitude and longitude passed to it as parameters.
// This function is invoked by the Virtual Earth WiFi service passing the latitude and
// longitude as the firts two parameters.
function SetAutoLocateViewport(latitude, longitude, lvl, bl, msg)
{
// Creates a Virtual Earth Latitude/Longitud object...
var latLong = new VELatLong(latitude, longitude);
// ... and centers the map around it
map.SetCenterAndZoom(latLong, 12);
}
// ShowMessage() is called by Virtual Earth WiFi service if it can't find the user location
function ShowMessage(msg)
{
alert("Couldn't find user latitude and longuitude:" + msg);
}
I got the idea for this how-to from an article written by Yousef El-Dardiry and published on Via Virtual Earth.