2012-11-17 9 views
6

W Google Maps API V3, Utworzyłem obiekt na mapie:Maps API V3: getCenter() i getZoom() nie działa

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

będę powiększać i patelni na tej mapie i iść wróć do pierwotnego widoku później, chciałbym zapisać poziom powiększenia i środek mapy. Próbuję:

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

Ale zmienne pozostają "niezdefiniowane". Kiedy robię to samo w konsoli, otrzymuję prawidłowe odpowiedzi.

Co robię źle? Daj mi znać, jeśli potrzebujesz więcej kodu, aby znaleźć odpowiedź lub czy jest to oczywisty problem.

Dzięki!

Pełny Kod:

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 
}); 


} 
+1

Za mało kontekstu. Czy zmienna mapy jest globalna? Jak go inicjujesz? Gdzie są używane wywołania getCenter i getZoom? – geocodezip

+0

Dzięki, po prostu dodano więcej kodu do pytań. – tomburger

+0

Wygląda na to, że u dołu jest dodatkowy nawias klamrowy. Czy jest tu więcej kontekstu? iirc, przypisywanie infowindow ma miejsce poza metodą initialize. fwiw, ogólna idea powinna jednak działać. Zrobiłem już coś podobnego. –

Odpowiedz

11

Problemem jest to, że granice i centrum nie są jeszcze ustalone. Aby je uzyskać, musisz to zrobić w detektorze na zoom_changed (dla zoomu); center_changed (dla centrum). Dostępne zdarzenia na mapie są wymienione w documentation, w ramach wydarzeń. Możesz użyć addListenerOnce, aby zrobić to tylko raz (za pierwszym razem).

Coś jak to powinno działać (nie testowane):

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(); }); 

nie będą mogli z nich korzystać dopiero po te wydarzenia zwolniony.

+0

Rozumiem. Kiedy ustawiam mapę za pomocą "map.fitBounds (bounds);" - czy nie ustawiasz powiększenia i środka, mimo że mapa jest wyśrodkowana i powiększona? – tomburger

+0

Ustawia je, ale są dostępne z metodami "get", dopóki te zdarzenia nie zostaną uruchomione. V3 interfejsu API jest oparta na zdarzeniach. – geocodezip

+0

Istnieje również zdarzenie 'idle', które jest przydatne, ponieważ' center_changed' może wystrzelić ** dużo ** ... google.maps.event.addListenerOnce (map, "idle", function() {}); ' –

Powiązane problemy