<!DOCTYPE html>
<html>
<head>
< http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\" />
< name=\"viewport\" content=\"initial-scale=1.0, user-scalable=no\" />
<style type=\"text/css\">
body, html{width: 100%;height: 100%;margin:0;font-family:\"微软雅黑\";}
#allmap{height:500px;width:100%;}
#r-result{width:100%;}
</style>
< type=\"text/ \" src=\"http://api.map.baidu.com/api?v=2.0&ak=密钥\"></ >
< >添加/删除地面叠加层</ >
</head>
<body>
<div id=\"allmap\"></div>
<div id=\"r-result\">
<input type=\"button\" =\"addGroundOverlay();\" value=\"添加\" />
<input type=\"button\" =\"removeGroundOverlay();\" value=\"删除\" />
</div>
</body>
</html>
< type=\"text/ \">
var TianAnMen = new BMap.Point(116.404449, 39.914889);
// 创建Map实例
var map = new BMap.Map(\"allmap\");
// 居中放大
map.centerAndZoom(TianAnMen, 12);
// 启用滚轮放大缩小
map.enableScrollWheelZoom();
// 西南角和东北角
var SW = new BMap.Point(116.29579,39.837146);
var NE = new BMap.Point(116.475451,39.9764);
groundOverlayOptions = {
opacity: 1,
displayOnMinLevel: 10,
displayOnMaxLevel: 22
}
// 初始化GroundOverlay
var groundOverlay = new BMap.GroundOverlay(new BMap.Bounds(SW, NE), groundOverlayOptions);
// 设置GroundOverlay的图片地址
groundOverlay.setImageURL(\'gkh.png\');
// 单击事件
groundOverlay.addEventListener(\'click\', function (clickEvent) {
// console.log(\'clickEvent\', clickEvent);
});
// 双击事件
groundOverlay.addEventListener(\'dblclick\', function (dblclickEvent) {
// console.log(\'dblclickEvent\', dblclickEvent);
});
function addGroundOverlay() {
// 添加GroundOverlay
map.addOverlay(groundOverlay);
}
function removeGroundOverlay() {
// 移除GroundOverlay
map.removeOverlay(groundOverlay);
}
</ >
![\"\"](\"/images/csdn/15451975711P54y5197O57T1.png\")
