GoogleマップApi - ズーム時に地図中心を変更しないでください

Question

ズームイン/アウトイベントで同じ地図中心を維持することは可能ですか？スクロールホイールを使用しているか、ダブルクリックしているか、またはズームコントロールを使用しているかは同じです。

スクロールホイールのズームイン/ズームアウト時にマップ上のマウスポインタの位置に偏りがあることに気がつきましたが、ドキュメントにオプションがありませんが、そのバイアスを上書きするのが理想的です。

here is a simple fiddle私の地図をどのように初期化していますか？コメントのアダムの提案@続き

var map = new google.maps.Map(document.getElementById("map_div"), { 
    center: new google.maps.LatLng(33.808678, -117.918921), 
    zoom: 15, 
    disableDefaultUI: true 
    }); 

Answer 1

、私はマップをインスタンス化する際に、スクロールホイール、ズーム、プラスダブルクリックズームを無効にし、自分の実装でこれらのイベントを処理するイベントリスナーを追加しました。ここで

はworking fiddleで、コードは次のように説明し

/* 
* declare map as a global variable 
*/ 
var map; 
/* 
* use google maps api built-in mechanism to attach dom events 
*/ 
google.maps.event.addDomListener(window, "load", function() { 
    var myMap = document.getElementById("map_div"); 
    /* 
    * create map 
    */ 
    var map = new google.maps.Map(myMap, { 
    center: new google.maps.LatLng(33.808678, -117.918921), 
    zoom: 15, 
    disableDefaultUI: true, 
    scrollwheel: false, 
    disableDoubleClickZoom: true 
    }); 
    //function that will handle the wheelEvent 
    function wheelEvent(event) { 
    var e = window.event || e; // old IE support 
    var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail))); //to know whether it was wheel up or down 
    map.setZoom(map.getZoom() + delta); 
    } 

    function zoomIn() { 
    map.setZoom(map.getZoom() + 1); 
    } 

    //add a normal event listener on the map container 
    myMap.addEventListener('mousewheel', wheelEvent, true); 
    myMap.addEventListener('DOMMouseScroll', wheelEvent, true); 

    //same with the double click 
    myMap.addEventListener('dblclick', zoomIn, true); 

    //add center changed listener for testing 
    google.maps.event.addListener(map, 'center_changed', function() { 
    console.log("this is what i'm trying to avoid"); 
    }); 
});