Question

生成Google地图时我遇到了一个小问题。

我正在寻找一种在调整大小后重新定位地图的方法。我的功能允许调整大小但我无法看出中心点。

function initialise() {
    var myMap = document.getElementById('map_div');
    google.maps.event.trigger(myMap, 'resize');       
};

Answer 1

我认为触发 Google地图的resize 不会影响Google地图的排名。但是，您可以使用以下方法设置/获取中心位置

map.getCenter();
map.setCenter(position);

以下是您的完整代码：

function initialise() {
    var myMap = document.getElementById('map_div');
    var centerPosition = myMap.getCenter();  //get the center position
    google.maps.event.trigger(myMap, 'resize');      
    myMap.setCenter(centerPosition);    // re-center the position
};

希望这有帮助。

Answer 2

API v3.24 from May 23rd 2016需要采用不同的方法：

var myMap = null, myPlace = null;

function initialiseGmapsStuff(){
    myPlace = new google.maps.LatLng( 51.482496, 0.00 ); // Greenwich
    var mapOptions = {
            zoom: 16, 
            center: myPlace,
            mapTypeId: google.maps.MapTypeId.SATELLITE, 
            scrollwheel: false, // Disable Mouse Scroll zooming (Essential for responsive sites!)
        };  
    myMap = new google.maps.Map(document.getElementById('gmaps-container'), mapOptions);
    google.maps.event.addDomListener( window, 'resize', $.throttle( 250, function(){ 
        if( myMap !== null && myPlace !== null ){
            myMap.setCenter( { lat: myPlace.lat(), lng: myPlace.lng() } );
        }
    } )
    );
}
google.maps.event.addDomListener(window, 'load', initialiseGmapsStuff);

请注意我对jQuery.throttle的使用 - 这不是必需的，但建议使用。如果你不使用jQuery，你显然应该使用一些本地形式的限制。

调整大小后的Google地图中心

2 个答案: