Come posso forzare il ridisegno con l'API di Google Maps API v3.0?

Question

Ho un'applicazione Maps abbastanza sofisticata che gestisce più marker personalizzati e così via. Ho una funzione chiamata resizeWindow che chiamo in un listener che ogni volta che lo schermo viene cambiato, la mappa si ridisegna calcolando nuovi limiti e forzando un ridimensionamento. Ecco come si presenta:

window.onresize = function(event) { fitmap(); }; 

e la funzione per ridimensionare è:

function fitmap(id) { 
    var coords = []; 
    var newlatlng = new google.maps.LatLng(projlat, projlng); 
    coords.push(newlatlng); 

     for (var i=0; i<markers[id].length; i++) { 
      newlatlng = new google.maps.LatLng(markers[id][i].latitude, markers[id][i].longitude); 
      coords.push(newlatlng); 
     } 
    } 

    var bounds = new google.maps.LatLngBounds(); 
    for (var i = 0, LtLgLen = coords.length; i < LtLgLen; i++) { 
     bounds.extend (coords[i]); 
    } 
    map.fitBounds(bounds); 

e questo funziona alla grande quando ho ridimensionare la finestra. Ma ...

Ho un menu che scende sul lato destro della finestra. Io uso jquery.animate per spostare quel menu fuori dallo schermo. Io chiamo la funzione fitmap come un processo step (o solo una volta alla fine) e non ridisegnerà la mappa.

$('#rightSide').animate({ right:"-240px" }, { 
    duration:1000, 
    step: function(now,fx) { 
     fitmap(); 
    } 
}); 

Ho letto e letto su questo e sembra che ci sia una stranezza di Google Maps API v3.0 che ridisegnare non accadrà se non cambia nulla in realtà. In questo caso, la mia finestra disponibile cambia da larghezza dello schermo - menu a schermo intero reale. Ma non avviene alcun ridisegno.

Ho provato google.maps.event.trigger (mappa, 'ridimensiona'); e anche questo non funziona.

Esiste un modo per forzare il ridisegno di Google Maps?

Answer 1

google.maps.event.trigger(MapInstance,'resize') sta funzionando bene per me, metterlo all'inizio della funzione fitMap.

cosa ti manca:

momento (non nel codice postato sopra, nel live-code), si chiamano resizeWindow su ogni step.

Quando si chiama questa funzione step la funzione verrà chiamata prima l'animazione per il passo attuale è terminato. Il risultato è che resizeWindow non verrà chiamato quando l'animazione completa è stata completata, ci sarà, ad es. un margine sul lato destro della mappa.

Soluzione: chiamare resizeWindow anche sul complete -selezionata su animation.