Loads the specified map. All parameters are optional.
VEMap.LoadMap(VELatLong, zoom, style, fixed, mode, showSwitch, tileBuffer, mapOptions);
Parameters
|
Parameter
|
Description
|
|---|
|
VELatLong
|
A VELatLong Class object that represents the center of the map. Optional.
|
|
zoom
|
The zoom level to display. Valid values range from 1 through 19. Optional. Default is 4.
|
|
style
|
A VEMapStyle Enumeration value specifying the map style. Optional. Default is VEMapStyle.Road.
|
|
fixed
|
A Boolean value that specifies whether the map view is displayed as a fixed map that the user cannot change. Optional. Default is false.
|
|
mode
|
A VEMapMode Enumeration value that specifies whether to load the map in 2D or 3D mode. Optional. Default is VEMapMode.Mode2D.
|
|
showSwitch
|
A Boolean value that specifies whether to show the map mode switch on the dashboard control. Optional. Default is true (the switch is displayed).
|
|
tileBuffer
|
How much tile buffer to use when loading map. Default is 0 (do not load an extra boundary of tiles). This parameter is ignored in 3D mode.
|
|
mapOptions
|
A VEMapOptions Class that specifies other map options to set.
|
Before calling this method, you must initialize the map object by using the VEMap Constructor.
If you want to use a callback function with the map control, set the VEMap.onLoadMap Property before calling the LoadMap method.
To 'lock' the map in a certain position, either set the fixed parameter to true when loading the map or disable mouse events during the application session. The following code disables mouse events.
// Attach an event handler for a mousedown event.
map.AttachEvent("onmousedown", DisableMap);
// When the mouse is used, the DisableMap function will
// get called. Returning true will disable the mousedown
// event, which disables panning.
function DisableMap()
{
return true;
}
<!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 selStyle = VEMapStyle.Aerial;
var selMode = VEMapMode.Mode2D;
var zoom = 4;
// Demonstrate LoadMap, with a UI for trying out all of the parameters.
function GetMap()
{
var latLon = new VELatLong(document.getElementById('txtLat').value, document.getElementById('txtLong').value);
if (document.getElementById('txtZoom').value > 0 && document.getElementById('txtZoom').value <= 19)
{
zoom = document.getElementById('txtZoom').value;
}
else
{
alert("Enter a value between 1 and 19.");
}
if (chkFixed.checked)
{
fixed=1;
}
else
{
fixed=0;
}
if (chkShowSwitch.checked)
{
showSwitch=1;
}
else
{
showSwitch=0;
}
map = new VEMap('myMap');
map.LoadMap(latLon, zoom, selStyle, fixed, selMode, showSwitch);
map.AttachEvent("onobliqueenter", SetObliqueRadio);
map.AttachEvent("onobliqueleave", SetObliqueRadio);
}
function SetStyle(s)
{
selStyle = s;
}
function SetMode(m)
{
if (modeRadios.mode[0].Checked)
{
selMode = VEMapMode.Mode2D;
}
else
{
selMode = VEMapMode.Mode3D;
}
}
function SetObliqueRadio(event)
{
if (event.eventName == "onobliqueenter")
{
styleRadios.style[3].disabled=null;
}
else if (event.eventName == "onobliqueleave")
{
styleRadios.style[3].disabled="disabled";
}
}
function DisposeMap()
{
if(map != null)
{
map.Dispose();
}
}
</script>
</head>
<body onload="GetMap();" onunload="DisposeMap();" style="font-family:Arial">
<div id='myMap' style="position: relative; width: 400px; height: 400px;">
</div>
<input id="btnLoad" type="button" onclick="GetMap()" value="Load A Map" />
<br />
Lat: <input id="txtLat" value="36.13371559517861" />
<br />
Lon: <input id="txtLong" value="-115.16238212585449" />
<br />
Zoom Level (1-19): <input id="txtZoom" value="9" style="width: 50px" />
<br />
Fixed: <input id="chkFixed" type="checkbox" /> (check to prevent user interaction)
<br />
Show Switch: <input id="chkShowSwitch" type="checkbox" checked="checked"/>
(show the map mode switch on the dashboard control)
<table width="400px">
<tr>
<td align="left" width="60%">
<form id="styleRadios">
Road: <input name="style" type="radio" onclick="SetStyle('r')" /> |
Aerial: <input name="style" type="radio" onclick="SetStyle('a')" checked="checked" />
<br />
Hybrid: <input name="style" type="radio" onclick="SetStyle('h')" /> |
Oblique: <input name="style" type="radio" onclick="SetStyle('o')" disabled="disabled"/>
</form>
</td>
<td align="left">
<form id="modeRadios">
2D: <input name="mode" type="radio" onclick="SetMode()" checked="checked" />
<br />
3D: <input name="mode" type="radio" onclick="SetMode()" />
</form>
</td>
</tr>
</table>
</body>
</html>
Reference
VEMap.SetCenter Method
VEMap.SetCenterAndZoom Method
VEMap.SetMapStyle Method
VEMap.SetMapMode Method
Concepts
VEMapOptions Class