Centers the map to a specific latitude and longitude and sets the zoom level.
VEMap.SetCenterAndZoom(VELatLong, zoomLevel);
Parameters
|
Parameter
|
Description
|
|---|
|
VELatLong
|
A VELatLong Class object that contains the latitude and longitude of the point on which to center the map,
|
|
zoomLevel
|
The zoom level for the map. Valid values range from 1 through 19.
|
The SetCenterAndZoom method returns results faster than if you call both the VEMap.SetCenter Method and the VEMap.SetZoomLevel Method separately.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6.2"></script>
<script type="text/javascript">
var map = null;
var latLong = null;
var zoomLevel = 3;
function GetMap()
{
map = new VEMap('myMap');
map.LoadMap();
map.SetZoomLevel(zoomLevel);
// zoom to cursor and center
map.SetMouseWheelZoomToCenter(false);
document.getElementById('txtZoom').value = zoomLevel;
map.AttachEvent("onclick", GetLatLong);
latLong = map.GetCenter();
divInfo.innerHTML = latLong;
}
function GetLatLong(e)
{
//Get the pixel coordinates from the click event, convert to LatLong value
var x = e.mapX;
var y = e.mapY;
pixel = new VEPixel(x, y);
latLong = map.PixelToLatLong(pixel);
divInfo.innerHTML = latLong;
}
function SetCenterAndZoom()
{
map.SetCenterAndZoom(latLong, zoomLevel);
}
function SetCenter()
{
map.SetCenter(latLong);
}
function SetZoom()
{
map.SetZoomLevel(zoomLevel);
}
function ZoomIn()
{
//Increase zoom level by a factor of 1
map.ZoomIn();
document.getElementById('txtZoom').value = map.GetZoomLevel();
}
function ZoomOut()
{
//Decrease zoom level by a factor of 1
map.ZoomOut();
document.getElementById('txtZoom').value = map.GetZoomLevel();
}
function ValidateEntry()
{
//Check to make sure zoom level is within range
if (document.getElementById('txtZoom').value > 0 && document.getElementById('txtZoom').value <= 19)
{
zoomLevel = document.getElementById('txtZoom').value;
}
else
{
alert("Enter a value between 1 and 19.");
}
}
</script>
</head>
<body onload="GetMap();" style="font-family:Arial">
<div id='myMap' style="position:relative; width:400px; height:400px;"></div>
Click the map to select a center point.<br />
<div id="divInfo"> <br /></div>
Zoom Level: <input id="txtZoom" type="text" value="" onchange="ValidateEntry()"/><br />
<input id="btnSetCZ" type="button" value="Set Center and Zoom" onclick="SetCenterAndZoom()"><br />
<input id="btnSetCenter" type="button" value="Set Center" onclick="SetCenter()"><br />
<input id="btnSetZoom" type="button" value="Set Zoom" onclick="SetZoom()"><br />
<input id="btnZoomIn" type="button" value="Zoom in by 1" onclick="ZoomIn()">
<input id="btnZoomOut" type="button" value="Zoom out by 1" onclick="ZoomOut()">
</body>
</html>
Reference
VEMap.GetCenter Method