地图显示范围
html,
body,
#container {
width: 100%;
height: 100%;
}
.lnglat {
color: #0288d1;
}
地图限制区域信息
NorthEast坐标:
SouthWest坐标:
限制地图显示范围
限定地图显示范围
取消地图显示限制
//创建地图
var map = new AMap.Map('container', {
resizeEnable: true,
zoom: 11,
showIndoorMap: false
});
function logMapInfo() {
var limitBounds = map.getLimitBounds();
if (limitBounds) {
document.querySelector("#ne").innerText = limitBounds.northeast.toString();
document.querySelector("#sw").innerText = limitBounds.southwest.toString();
} else {
document.querySelector("#ne").innerText = document.querySelector("#sw").innerText = "未限定";
}
}
//限制地图显示范围
function lockMapBounds() {
var bounds = map.getBounds();
map.setLimitBounds(bounds);
logMapInfo();
}
//取消地图显示限制
function unlockMapBounds() {
map.clearLimitBounds();
logMapInfo();
}
//启用地图范围限定
lockMapBounds();
logMapInfo();
//绑定按钮事件
document.querySelector("#lock-bounds").onclick = lockMapBounds;
document.querySelector("#unlock-bounds").onclick = unlockMapBounds;