Maps APIをV3：Google MapsのAPI V3で

Question

を動作していないgetCenter（）とgetZoom（）、私はマップオブジェクトを作成しました：

map = new google.maps.Map(document.getElementById("map_canvas"), 
    myOptions); 

を私はその地図上パンにズームし、行くために後で元のビューに戻って、ズームレベルと地図の中心を保存したいと思います。私は以下を試してみる：

oldCenter = map.getCenter(); 
oldZoom = map.getZoom(); 

しかし、変数は '未定義'のままです。コンソールで同じことをすると、私は正しい応答を得ます。

私は間違っていますか？答えを見つけるためにもっとコードが必要なのか、それとも明らかな問題があるのか​​どうか教えてください。

ありがとうございます！

全コード：

function initialize() { 

    // CUSTOM PLACES 
    var latlng = new google.maps.LatLng(51, 10); 
    var germany = new google.maps.LatLng(51, 10); 
    var myLatlng = new google.maps.LatLng(49,12); 

    // DEFINE STYLE 
    var styles = [ 
    { 
     "stylers": [ 
     { "invert_lightness": true } 
     ] 
    } 
    ]; 

    // MARKER STYLES 
    var coin_image = 'coin.png'; 
    var merch_image = 'merch.png'; 

    // DEFINE OPTIONS FOR MAP 
    var myOptions = { 
    panControl: false, 
    zoomControl: true, 
    zoomControlOptions: { 
     style: google.maps.ZoomControlStyle.SMALL, 
     position: google.maps.ControlPosition.LEFT_TOP 
    }, 
    mapTypeControl: false, 
    scaleControl: false, 
    streetViewControl: false, 
    overviewMapControl: false, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 


    // CREATE MAP OBJECT 
    map = new google.maps.Map(document.getElementById("map_canvas"), 
     myOptions); 

    map.setOptions({styles: styles}); 

    // select zoom, etc by defining 2 points 
    var southWest = new google.maps.LatLng(45,-10); 
    var northEast = new google.maps.LatLng(55,15); 
    var bounds = new google.maps.LatLngBounds(southWest,northEast); 
    map.fitBounds(bounds); 

    placeMarker(southWest); 
    placeMarker(northEast); 

    // Place Random Markers 
    var lngSpan = northEast.lng() - southWest.lng(); 
    var latSpan = northEast.lat() - southWest.lat(); 
    for (var i = 0; i < 50; i++) { 
    var location = new google.maps.LatLng(southWest.lat() + latSpan * Math.random(), 
     southWest.lng() + lngSpan * Math.random()); 
    var marker = new google.maps.Marker({ 
     position: location, 
     map: map, 
     icon: merch_image 
    }); 
    var j = i + 1; 
    marker.setTitle(j.toString()); 
    } 


    // TRANSACTION MARKERS 

    // ONE FULL CYCLE 
    // set marker 

    var trans_marker = new google.maps.LatLng(52.31799,13.241904); 
    var marker = new google.maps.Marker({ 
     position: trans_marker, 
     map: map, 
     animation: google.maps.Animation.DROP, 
     title:"Hello World!", 
     icon: coin_image 
    }); 

     // HERE'S THE PROBLEM 
    // var oldCenter = map.getCenter(); 
    // var oldZoom = map.getZoom(); 

    console.log(map); 
    oldMap = map; 
    console.log(oldMap); 
    // console.log(oldZoom); 
    // console.log(oldCenter.toString()); 

    // pan to marker 
    setTimeout(function() {map.panTo(trans_marker)}, startDelayed(3000)); 

    // zoom in on marker 
    setTimeout(function() {zoomIn(ENDZOOM)}, startDelayed(1000)); 

    // show info window 
    var contentString = "<h3>Döner @ Coco Banh</h3>"; 
    contentString += ("<p>SumUp was used to pay for a Döner at Coco Banh in Berlin, Germany</p>"); 
    var infowindow = new google.maps.InfoWindow({ 
    content: contentString 
    }); 

    setTimeout(function() {infowindow.open(map,marker)}, startDelayed(8000)); 
    setTimeout(function() {infowindow.close()}, startDelayed(5000)); 

    // zoom out again 
    setTimeout(function() {zoomOut(oldZoom)}, startDelayed(2000)); 

    // center again 
    setTimeout(function() {map.panTo(oldCenter)}, startDelayed(8000)); 

} 
    infowindow = new google.maps.InfoWindow({ 
    content: contentString 
}); 


} 

Answer 1

問題が境界と中心がまだ設定されていないことです。それらを取得するには、zoom_changed（ズーム用）のリスナーでそれを行う必要があります。 center_changed（センター用）。利用可能なマップイベントは、イベントの下でdocumentationに記載されています。 addListenerOnceを使用すると、最初の1回だけ行うことができます。

このような何かが動作するはずです（テストしていません）：

var oldZoom = null; 
var oldCenter = null; 
google.maps.event.addListenerOnce(map, "zoom_changed", function() { oldZoom = map.getZoom(); }); 
google.maps.event.addListenerOnce(map, "center_changed", function() { oldCenter = map.getCenter(); }); 

あなたはこれらのイベントが発火した後まで、それらを使用することはできません。