google-maps - サイズ変更後の Google マップ センター

Question

Google マップの生成時に小さな問題があります。

サイズ変更後にマップを再センタリングする方法を探しています。私の機能ではサイズ変更が可能ですが、中心点がわかりません。

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

Answer 1

2016 年 5 月 23 日の API v3.24では、別のアプローチが必要です。

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 を使用していない場合は、ネイティブ形式のスロットリングを使用する必要があります。