不再支持该地图控件
使用 Bing Maps 地图控件时，首先要在网站上显示地图。
显示默认地图
若要显示包含所有导航功能的默认地图，需要完成以下步骤：
在 HTML 页顶端，添加以下 DOCTYPE 声明。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">在 HTML 页的头部分中，添加 META 元素，并将 charset 属性设置为**“utf-8”**，如下所示。
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">备注
建议您在网页中使用 UTF-8 编码。
还要在头部分中，添加对地图控件的引用，如下所示。
<script charset="UTF-8" type="text/javascript" src="http://dev.ditu.live.com/mapcontrol/mapcontrol.ashx?v=6.2&mkt=en-us"> </script>备注
有关使用 mkt 属性设置地图区域的详细信息，请参阅返回本地化结果主题。
在页面的正文部分，为页面添加 DIV 元素以包含地图。地图的大小由 DIV 元素的高度和宽度定义。使用“position”、“top”和“left”属性来设置地图的位置。您可以通过内联方式设置这些值，也可以通过样式类定义这些值，然后引用该样式类，如下所示。
<div id='myMap' style="position:absolute; width:400px; height:400px;"></div>或
.map { position: absolute; top: 20; left: 10; width: 400px; height: 400px; border:#555555 2px solid; } ... <div id="map" class="map"></div>备注
如果不指定宽度，将使用默认宽度（600 像素）。默认高度为 400 像素。为实现不同浏览器之间的兼容性，应总是指定位置属性（“绝对”和“相对”都是有效值）。如果在地图 DIV 中使用百分比宽度和高度，则它们分别是相对于父元素的宽度和高度的百分比。
创建 VEMap 类的一个新实例，并调用 VEMap.LoadMap 方法，如下所示。
var map = new VEMap('myMap'); map.LoadMap();备注
大多数情况下，必须在调用 VEMap 方法或尝试访问 VEMap 属性之前调用 LoadMap 方法。但也有一些例外情况，要求在新建 VEMap 对象之后、在对新建对象调用 LoadMap 方法之前调用，如下所示：
加载地图时对其进行自定义
也可以在第一次加载地图时指定地图的位置、缩放级别和样式。若要完成此任务，请使用重载的 VEMap.LoadMap 方法函数（如下）来传入以下设置：位置、缩放级别、地图样式、是否锁定地图、地图模式、是否显示地图模式切换以及在地图周围显示多少图块缓冲区。
var map = new VEMap('myMap');
map.LoadMap(new VELatLong(47.6, -122.33, 0, VEAltitudeMode.RelativeToGround), 10, VEMapStyle.Road, false, VEMapMode.Mode2D, true, 1);
示例
下面是完整网页（包含显示地图所需的所有元素）的示例。
<!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://dev.ditu.live.com/mapcontrol/mapcontrol.ashx?v=6.2"></script>
<script type="text/javascript">
var map = null;
var LA = new VELatLong(34.0540, -118.2370);
var pinPoint = null;
var pinPixel = null;
function GetMap()
{
map = new VEMap('myMap');
map.LoadMap(LA, 14, VEMapStyle.Road, false, VEMapMode.Mode2D, true, 1);
AddPin();
}
function getInfo()
{
var info;
if (map.IsBirdseyeAvailable())
{
var be = map.GetBirdseyeScene();
info = "ID: " + be.GetID() + "\n";
info += "orientation: " + be.GetOrientation()+ "\n";
info += "height: " + be.GetHeight() + "\n";
info += "width: " + be.GetWidth() + "\n";
var pixel = be.LatLongToPixel(map.GetCenter(), map.GetZoomLevel());
info += "LatLongToPixel: " + pixel.x + ", " + pixel.y + "\n";
// Check to see if the current birdseye view contains the pushpin pixel point.
info += "contains pixel " + pinPixel.x + ", " + pinPixel.y + ": " +
be.ContainsPixel(pinPixel.x, pinPixel.y, map.GetZoomLevel()) + "\n";
// Check to see if the current view contains the pushpin LatLong.
info += "contains latlong " + pinPoint + ": " + be.ContainsLatLong(pinPoint) + "\n";
// This method may return null, depending on the selected view and map style.
info += "latlong: " + map.PixelToLatLong(pixel);
alert(info);
}
else
{
var center = map.GetCenter();
info = "Zoom level:\t" + map.GetZoomLevel() + "\n";
info += "Latitude:\t" + center.Latitude + "\n";
info += "Longitude:\t" + center.Longitude;
alert(info);
}
}
function AddPin()
{
// Add a new pushpin to the center of the map.
pinPoint = map.GetCenter();
pinPixel = map.LatLongToPixel(pinPoint);
map.AddPushpin(pinPoint);
}
</script>
</head>
<body onload="GetMap();">
<div id='myMap' style="position:relative; width:400px; height:400px;"></div>
<input id="btnGetInfo" type="button" value="Get Scene Information" name="getinfo" onclick="getInfo();">
<br/>
(zoom out 5 clicks to get latitude/longitude and zoom level)
</body>
</html>