天天看點

Google maps V3控制地圖的縮放和顯示範圍

【熊貓大叔   轉載請注明出處:http://blog.csdn.net/pandaflyup】

1、控制地圖的縮放範圍:

實作起來很簡單,設定一個最低和最高的縮放級别ZoomLevel,再添加一個監聽縮放級别變化的事件即可,代碼如下:

function initialize() {
        var MinZoomLevel=16;
        var myLatlng = new google.maps.LatLng(39.9629, 116.3581);
        var myOptions = {
            zoom: MinZoomLevel,
            center: myLatlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
        //控制地圖的縮放級别
        google.maps.event.addListener(map, 'zoom_changed',function() {
            if (map.getZoom() < MinZoomLevel) map.setZoom(MinZoomLevel);
         });
}
           

2、控制地圖的顯示範圍:

通過劃定一個界限,可以使地圖隻在劃定的範圍内顯示,由于實作起來比較簡單,就直接上代碼了:

var strictBounds = new google.maps.LatLngBounds(
    new google.maps.LatLng(14.48003790418668, 66.28120434863283),
    new google.maps.LatLng(54.44617552862156, 143.71284497363283)
);
google.maps.event.addListener(map, 'dragend',
function() {
    if (strictBounds.contains(map.getCenter())) return;
    var c = map.getCenter(),
    x = c.lng(),
    y = c.lat(),
    maxX = strictBounds.getNorthEast().lng(),
    maxY = strictBounds.getNorthEast().lat(),
    minX = strictBounds.getSouthWest().lng(),
    minY = strictBounds.getSouthWest().lat();
    if (x < minX) x = minX;
    if (x > maxX) x = maxX;
    if (y < minY) y = minY;
    if (y > maxY) y = maxY;
    map.setCenter(new google.maps.LatLng(y, x));
});
           

繼續閱讀