2010-06-26 14 views
72

In V2 c'era un modo per limitare il trascinamento/trascinamento in modo che la mappa restasse entro certi limiti. Come è fatto in V3?Come si limita la panoramica nell'API di Google Maps V3?

Diciamo che voglio che gli utenti guardino solo all'Europa. Ho già limitato lo zoom, ma se permetto il trascinamento (che devo in questo caso, per altri motivi), l'utente può scorrere oltre l'area che voglio mostrare.

Si prega di dare lavoro ad esempio o frammento di codice - Io non sono un programmatore esperto ...

Grazie!

risposta

20

Il trucco è ascoltare l'evento dragend e se la mappa viene trascinata fuori dai limiti consentiti, spostarla nuovamente all'interno. Se si definiscono i limiti consentiti come oggetto LatLngBounds, è possibile utilizzare il metodo , poiché restituisce true se l'argomento lat/lng specificato si trova all'interno dei limiti.

È anche importante limitare il livello di zoom, ma sembra che lo stiate già facendo.

Pertanto, si consiglia di provare il seguente esempio:

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
    <title>Google Maps JavaScript API v3 Example: Limit Panning</title> 
    <script type="text/javascript" 
      src="http://maps.google.com/maps/api/js?sensor=false"></script> 
</head> 
<body> 
    <div id="map" style="width: 400px; height: 300px;"></div> 

    <script type="text/javascript"> 

    var minZoomLevel = 5; 

    var map = new google.maps.Map(document.getElementById('map'), { 
     zoom: minZoomLevel, 
     center: new google.maps.LatLng(38.50, -90.50), 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }); 

    // Bounds for North America 
    var allowedBounds = new google.maps.LatLngBounds(
    new google.maps.LatLng(28.70, -127.50), 
    new google.maps.LatLng(48.85, -55.90)); 

    // Listen for the dragend event 
    google.maps.event.addListener(map, 'dragend', function() { 
    if (allowedBounds.contains(map.getCenter())) return; 

    // Out of bounds - Move the map back within the bounds 

    var c = map.getCenter(), 
     x = c.lng(), 
     y = c.lat(), 
     maxX = allowedBounds.getNorthEast().lng(), 
     maxY = allowedBounds.getNorthEast().lat(), 
     minX = allowedBounds.getSouthWest().lng(), 
     minY = allowedBounds.getSouthWest().lat(); 

    if (x < minX) x = minX; 
    if (x > maxX) x = maxX; 
    if (y < minY) y = minY; 
    if (y > maxY) y = maxY; 

    map.setCenter(new google.maps.LatLng(y, x)); 
    }); 

    // Limit the zoom level 
    google.maps.event.addListener(map, 'zoom_changed', function() { 
    if (map.getZoom() < minZoomLevel) map.setZoom(minZoomLevel); 
    }); 

    </script> 
</body> 
</html> 

Schermata dall'esempio precedente. L'utente non sarà in grado di trascinare più a sud o estremo oriente, in questo caso:

Google Maps JavaScript API v3 Example: Limit Panning

+2

Sulle mappe grandi (quando il contenitore non è troppo piccolo) di default ci sono anche i controlli che consentono all'utente di navigare (pannello di navigazione). L'uso potrebbe premere la freccia sinistra/destra. Quindi i tuoi eventi non sono sufficienti per risolvere tutti i problemi. Dovrai prendere l'evento inattivo. Un buon esempio è qui http://code.google.com/p/gmaps-api-issues/issues/detail?id=1371 qualche ragazzo isaac.z.foster lo ha pubblicato. Ma in ogni caso la logica con l'azione e poi il ripristino è pessima. Anche la cosa più brutta che per impostazione predefinita google map mostra a livello di zoom massimo diversi mondi. E i marcatori sono duplicati. Il codice Google è davvero molto orribile. –

+0

Anche riguardo a minZoomLevel. C'è l'opzione mappa minzoom. Non è necessario gestire l'evento. –

3

Ecco una bella estensione a the above che consente di resettare il centro della Mappa per l'ultima posizione valida ascoltando l'evento dragstart .

// Limit panning 
var lastCenter = map.getCenter(); 

google.maps.event.addListener(map, 'dragstart', function() { 
    lastCenter = map.getCenter(); 
}); 

google.maps.event.addListener(map, 'dragend', function() { 
    if(allowedBounds.contains(map.getCenter())) return; 

    map.setCenter(lastCenter); 
}); 
86

Credo di essere un po 'in ritardo alla festa, ma dato che questo era esattamente quello che mi serviva proprio adesso e migliorato su di esso, ho pensato di inserire una domanda in ogni caso.

Con entrambe le risposte di Daniel Vassallo e brendo, l'utente può ancora utilizzare il controllo di pan (se attivato) per spostarsi dall'area desiderata. La cosa @ Yauhen.F menzionata in un commento.

Quindi, invece di utilizzare l'evento dragend, utilizzo l'evento center_changed. Questo viene continuamente attivato durante il trascinamento e ogni volta che qualcuno usa il controllo di pan.

// bounds of the desired area 
var allowedBounds = new google.maps.LatLngBounds(
    new google.maps.LatLng(70.33956792419954, 178.01171875), 
    new google.maps.LatLng(83.86483689701898, -88.033203125) 
); 
var lastValidCenter = map.getCenter(); 

google.maps.event.addListener(map, 'center_changed', function() { 
    if (allowedBounds.contains(map.getCenter())) { 
     // still within valid bounds, so save the last valid position 
     lastValidCenter = map.getCenter(); 
     return; 
    } 

    // not valid anymore => return to last valid position 
    map.panTo(lastValidCenter); 
}); 

Salvando l'ultima posizione valida continuamente durante il trascinamento, il movimento sarà solo smettere una volta che è fuori dai limiti, invece di yerking indietro una volta il trascinamento è conclusa. ......

+2

Questo è un metodo ECCELLENTE. Mi è piaciuta l'idea di Brendo, ma questo rimuove quella fascia di gomma al suo posto e ferma la mappa ai limiti. Ho usato questo turno una mappa in un'immagine statica senza alcun panning, ma con marcatori dinamici. molto maneggevole. Grazie! – Jake

+2

Grande, l'evento 'center_changed' è la chiave. Ma ci sono ancora alcuni problemi sui dispositivi mobili (iOS). –

+1

Qualcuno ha capito come farlo sul cellulare? Non sembra che center_changed o drag venga inviato durante il trascinamento sul cellulare – K2xL

0

C'è il another thread sull'argomento che è anche molto buono. Il problema che dovevo risolvere era che invece di impostare i limiti manualmente e controllare il contenimento del centro, volevo un limite impostato sul caricamento della pagina, quindi consentire il trascinamento fino al bordo se ingrandito.

Così ho impostato i limiti del panning sul caricamento della mappa, una volta. Poi controllo se la mappa è ancora allo zoom massimo e in tal caso, restituire il centro iniziale. Se ingrandito, voglio eseguire una panoramica sull'EDGE dei limiti iniziali, non solo per controllare se CENTER è contenuto, perché ciò estenderebbe il panning consentito della metà del viewport.

Sfortunatamente, anche se questo ha portato a termine il lavoro e funziona bene quando si effettua il paning lentamente, è un po 'a scatti se si esegue una panoramica veloce.

Se avete suggerimenti su come questo può essere evitato, sarei grato.

map = new google.maps.Map(// defaults 
     document.getElementById("map22"), 
     { 
      disableDefaultUI  : true, 
      zoomControl    : true, 
      zoom     : 7, 
      minZoom     : 7, 
      maxZoom     : 10, 
      center     : new google.maps.LatLng(
       64.99473104134819, 
       -19.22332763671875 
      ), 
      mapTypeId    : google.maps.MapTypeId.ROADMAP 
     } 
    ); 



    function borders(){ 
     return { 
      maxLat : map.getBounds().getNorthEast().lat(), 
      maxLng : map.getBounds().getNorthEast().lng(), 
      minLat : map.getBounds().getSouthWest().lat(), 
      minLng : map.getBounds().getSouthWest().lng(), 
      center : map.getCenter() 
     } 
    } 

    google.maps.event.addListenerOnce(map,'idle',function() { 
     limit = borders(); 
    }); 

    google.maps.event.addListener(map,'drag',function() { 
     if(map.getZoom() == 7) return map.setCenter(limit.center); 
     current = borders(); 
     if(current.maxLng < limit.maxLng && current.minLng > limit.minLng) activeCenterLng = current.center.lng(); 
     if(current.maxLat < limit.maxLat && current.minLat > limit.minLat) activeCenterLat = current.center.lat(); 
     map.setCenter(
      new google.maps.LatLng(
       activeCenterLat, 
       activeCenterLng 
      ) 
     ); 
    }); 
0

quando sto usando il drag o dragend o qualsiasi altra cosa, la mappa ritorna in limiti consentiti, invece di semplicemente limitando il movimento traboccante. Basta cambiare l'evento in "center_changed" per impedirgli di saltare in giro in quel modo.

jsfiddle Modificato: http://jsfiddle.net/Vjdde/1/

Edit: Non certo perché il violino non produce un overflow dello stack, ma dovrebbe, in quanto setCenter chiamerà center_changed nuovo .. Basta guardare fuori

1

ho cercato la risposta da HenningJ e la mappa non smetterebbero di panning fino a quando il centro non si trovava in un angolo dei limiti che non era l'ideale. Qui è la mia soluzione:

google.maps.event.addListener(map, 'center_changed', function() { 
    var mapBounds = map.getBounds(); 
    if(allowedBounds.contains(mapBounds.getNorthEast()) && allowedBounds.contains(mapBounds.getSouthWest())) { 
     lastCenter = map.getCenter(); 
     return; 
    } 

    map.panTo(lastCenter); 
}, this)); 
+0

quello script non funziona affatto :( – tim

9

La mia versione, basata su quella da @HenningJ, ma con qualche modifica del lastValidCenter per consentire liscia trascinando lungo i bordi dei limiti.

<!DOCTYPE html> 
<html> 
    <head> 
     <style type="text/css"> 
      html { height: 100% } 
      body { height: 100%; margin: 0; padding: 0 } 
      #map-canvas { height: 100% } 
     </style> 
     <script type="text/javascript" 
      src="http://maps.google.com/maps/api/js?sensor=false"></script> 
     </script> 
     <script type="text/javascript"> 
      function initialize() { 
       var mapOptions = { 
        center: new google.maps.LatLng(28.70, -127.50), 
        zoom: 4, 
        mapTypeId: google.maps.MapTypeId.ROADMAP 
       }; 
       var map = new google.maps.Map(document.getElementById("map-canvas"), 
         mapOptions); 

       // bounds of the desired area 
       var allowedBounds = new google.maps.LatLngBounds(
        new google.maps.LatLng(28.70, -127.50), 
        new google.maps.LatLng(48.85, -55.90) 
       ); 
       var boundLimits = { 
        maxLat : allowedBounds.getNorthEast().lat(), 
        maxLng : allowedBounds.getNorthEast().lng(), 
        minLat : allowedBounds.getSouthWest().lat(), 
        minLng : allowedBounds.getSouthWest().lng() 
       }; 

       var lastValidCenter = map.getCenter(); 
       var newLat, newLng; 
       google.maps.event.addListener(map, 'center_changed', function() { 
        center = map.getCenter(); 
        if (allowedBounds.contains(center)) { 
         // still within valid bounds, so save the last valid position 
         lastValidCenter = map.getCenter(); 
         return; 
        } 
        newLat = lastValidCenter.lat(); 
        newLng = lastValidCenter.lng(); 
        if(center.lng() > boundLimits.minLng && center.lng() < boundLimits.maxLng){ 
         newLng = center.lng(); 
        } 
        if(center.lat() > boundLimits.minLat && center.lat() < boundLimits.maxLat){ 
         newLat = center.lat(); 
        } 
        map.panTo(new google.maps.LatLng(newLat, newLng)); 
       }); 
      } 
      google.maps.event.addDomListener(window, 'load', initialize); 
     </script> 
    </head> 
    <body> 
     <div id="map-canvas"/> 
    </body> 
</html> 

Fiddle qui: http://jsfiddle.net/koenpunt/n7h6t/

+0

Funziona molto bene! –

+0

E soffre di lo stesso problema della soluzione di @ HenningJ.Questo è solo il controllo che il centro della mappa è all'interno dei confini.Se il centro della mappa è proprio accanto al confine, hai metà della mappa fuori dai confini. è necessario un calcolo elaborato (il centro può essere una buona approssimazione per i bassi livelli di zoom, ma non per la vista del mondo) - –

+0

Questa deve essere una risposta – Crone

0

le soluzioni qui mi ha lasciato con 2 numeri. Prima di tutto, se tenete premuto il tasto freccia in modo che abbia iniziato a scorrere rapidamente, quando ha colpito il bordo, non sarebbe andato fino al limite perché a causa dell'accelerazione del panning, prendendo "passi" di grandi dimensioni, il prossimo " passo "sarebbe andato fuori dai limiti, quindi non ci vuole l'ultimo" passo ". Quindi, una volta fermato, è possibile rilasciare il tasto freccia e quindi premerlo di nuovo, e potrebbe scorrere un po 'di più. In secondo luogo, queste soluzioni non contenevano correttamente il panning dopo un cambio di zoom. Sono riuscito a risolvere entrambi e ho pubblicato la mia soluzione in another thread, ma ho pensato di collegarlo qui, poiché questo è stato il thread che mi ha fatto iniziare nella giusta direzione.

+0

La soluzione collegata non funziona Per me funziona troppo bene: i movimenti della mappa non sono fluidi –

+1

@ JoseGómez ha funzionato senza problemi per me: http://zelda.qwertymodo.com/overwor ld/lightworld/ – qwertymodo

3

Il metodo migliore per limitare è, impostare il livello di zoom e il punto centrale e disabilitare i controlli come zoom, scroll ecc. Come di seguito.

var latlng = new google.maps.LatLng(18.283078,84.047556); 
    var myOptions = { 
      zoom: 12, 

      center: latlng, 
      zoomControl: false, 
      mapTypeId: google.maps.MapTypeId.ROADMAP, 
      scrollwheel: false, 
     navigationControl: false, 
     mapTypeControl: false, 
     scaleControl: false, 
     draggable: false, 
     disableDoubleClickZoom: true, 
     }; 
     map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 
+0

Questa è una buona soluzione se si desidera limitare completamente il panning e lo zoom, ma non per "limitare determinati limiti" come richiesto. Puoi anche utilizzare map.setOptions() se la mappa esiste già e volevi bloccarla dopo averla creata. – intotecho

0

Questo è HenningJ - ma HenningJ su iOS utilizza lastValidCentre - che non è buono, come il suo vecchio, così ho morsetto, che lo rende migliore su iOS.

var mapObject = plugin_map.gmap3('get'); 
var allowedBounds = new google.maps.LatLngBounds(
    new google.maps.LatLng(41.3957556, -88.4345472), 
    new google.maps.LatLng(49.4010417, -78.4286389) 
); 
google.maps.event.addListener(mapObject, 'center_changed', function() { 
    if (allowedBounds.contains(mapObject.getCenter())) { 
     // still within valid bounds, so save the last valid position 
     return; 
    } 

    // not valid anymore => return to last valid position 
    var c = mapObject.getCenter(), 
     x = c.lng(), 
     y = c.lat(), 
     maxX = allowedBounds.getNorthEast().lng(), 
     maxY = allowedBounds.getNorthEast().lat(), 
     minX = allowedBounds.getSouthWest().lng(), 
     minY = allowedBounds.getSouthWest().lat(); 

    if (x < minX) x = minX; 
    if (x > maxX) x = maxX; 
    if (y < minY) y = minY; 
    if (y > maxY) y = maxY; 

    //mapObject.setCenter(new google.maps.LatLng(y, x)); 
    mapObject.panTo(new google.maps.LatLng(y, x)); 
}); 
2

Ecco una soluzione che è unire insieme la risposta di Tom Andersen e la risposta HenningJ attualmente accettata. I vantaggi di questo è che 1) consente uno scrolling più agevole lungo i bordi (con la soluzione di HenningJ apparentemente goffo), e 2) non ha alcun problema quando si esegue lo zoom fuori da un'area (anche in questo caso la risposta di HenningJ sembrava interrompersi quando si ingrandiva e fuori vicino ai confini).

La risposta di Tom era vicina a lavorare per me, tranne che posizionava l'area bloccata al centro dello schermo, che non era accettabile per l'applicazione su cui stavo lavorando.

// bounds of the desired area 
var allowedBounds = new google.maps.LatLngBounds(
    new google.maps.LatLng(70.33956792419954, 178.01171875), 
    new google.maps.LatLng(83.86483689701898, -88.033203125) 
); 
var lastValidCenter = map.getCenter(); 

google.maps.event.addListener(map, 'center_changed', function() { 

    var mapBounds = map.getBounds(); 
    var mapNe = mapBounds.getNorthEast(); 
    var mapSw = mapBounds.getSouthWest(); 
    var center = map.getCenter(); 

    if(allowedBounds.contains(mapNe) && allowedBounds.contains(mapSw)) { 
     //the user is scrolling within the bounds. 
     lastValidCenter = center; 
     return; 
    } 

    //the user has scrolled beyond the edge. 

    var mapWidth = mapNe.lng() - mapSw.lng(); 
    var mapHeight = mapNe.lat() - mapSw.lat(); 

    var x = center.lng(); 
    var y = center.lat(); 

    var maxX = allowedBounds.getNorthEast().lng(); 
    var maxY = allowedBounds.getNorthEast().lat(); 
    var minX = allowedBounds.getSouthWest().lng(); 
    var minY = allowedBounds.getSouthWest().lat(); 

    //shift the min and max dimensions by 1/2 of the screen size, so the bounds remain at the edge of the screen 

    maxX -= (mapWidth/2); 
    minX += (mapWidth/2); 

    maxY -= (mapHeight/2); 
    minY += (mapHeight/2); 


    if (x < minX) { 
     x = minX; 
    } 
    if (x > maxX) { 
     x = maxX; 
    } 
    if (y < minY){ 
     y = minY; 
    } 
    if (y > maxY){ 
     y = maxY; 
    } 

    map.panTo(new google.maps.LatLng(y, x)); 

}); 
1

Pubblicherò la mia risposta nel caso in cui qualcuno sia interessato perché non sono riuscito a ottenere ciò di cui avevo bisogno con nessuna delle altre soluzioni pubblicate qui.

Quello che mi serviva era limitare i limiti verticali (latitudine) della mappa in modo che l'utente non fosse in grado di eseguire la panoramica oltre i limiti di latitudine della terra (~ +/- 85 gradi), ma qualsiasi altro limite sarebbe lavoro anche.

Questo approccio utilizza lo stesso evento center_changed come descritto altrove e semplicemente corregge il centro nel caso in cui vengano visualizzate parti dei limiti proibiti.

Questo meccanismo funziona solo se lo zoom minimo della mappa è impostato in modo che lo zoom in uscita non possa mai mostrare un'area maggiore di quella entro i limiti consentiti.

esempio di lavoro: http://jsbin.com/vizihe

function initMap() { 
    // sample bounds, can be anything and goes hand in hand with minZoom 
    var northBoundary = 40 
    var southBoundary = -40 

    var map = new google.maps.Map(document.getElementById('map'), { 
    center: {lat: 0, lng: 0}, 
    zoom: 4, 
    // it's important to set this to a large enough value 
    // so that zooming out does not show an area larger than allowed 
    minZoom: 4 
    }) 

    map.addListener('center_changed', function() { 
    var bounds = map.getBounds(); 
    var ne = bounds.getNorthEast() 
    var sw = bounds.getSouthWest() 
    var center = map.getCenter() 

    if(ne.lat() > northBoundary) { 
     map.setCenter({lat: center.lat() - (ne.lat() - northBoundary), lng: center.lng()}) 
    } 

    if(sw.lat() < southBoundary) { 
     map.setCenter({lat: center.lat() - (sw.lat() - southBoundary), lng: center.lng()}) 
    } 
    }) 
} 
html, body, #map { 
    height: 100%; 
    margin: 0; 
    padding: 0; 
} 
<!DOCTYPE html> 
<html> 
    <head> 
<meta name="description" content="limit google map panning"> 
    <title>Simple Map</title> 
    <meta name="viewport" content="initial-scale=1.0"> 
    <meta charset="utf-8"> 
    </head> 
    <body> 
    <div id="map"></div> 
    <script src="https://maps.googleapis.com/maps/api/js?callback=initMap" 
    async defer></script> 
    </body> 
</html> 
0

So po 'in ritardo alla festa, ma sembra che a partire dal metà 2016, non c'è nessun funzionario modo per limitare l'area visibile.

Esistono alcune soluzioni per limitare i limiti (alcuni di essi in questa domanda) ma per me hanno comunque un difetto, poiché non limitano i limiti esattamente per adattarsi alla vista mappa, limitano solo il centro della mappa essere contenuto entro i limiti specificati. Se si desidera limitare i limiti di sovrapposizione di immagini come me, questo può portare a un comportamento come illustrato di seguito, in cui la mappa underlaying è visibile sotto il nostro sovrapposizione di immagini:

enter image description here

Per affrontare questo problema, ho creato un library, che limita con successo i limiti in modo che non è possibile eseguire la panoramica dall'overlay.

Tuttavia, come altre soluzioni esistenti, ha un problema "vibrante". Quando l'utente esegue il panning della mappa in modo abbastanza aggressivo, dopo aver rilasciato il pulsante sinistro del mouse, la mappa continua a eseguire il panning da sola, rallentando gradualmente. Ritorna sempre indietro alla mappa, ma questo si traduce in una sorta di vibrazione, che si risolve dopo un momento. Questo effetto panning non può essere interrotto con i mezzi forniti dall'API Js al momento. Sembra che fino a quando Google aggiungerà il supporto per qualcosa come map.stopPanningAnimation() non saremo in grado di creare un'esperienza fluida.

Esempio utilizzando la libreria accennato, la migliore esperienza severi limiti sono stato in grado di ottenere:

function initialise(){ 
 
    
 
    var myOptions = { 
 
    zoom: 5, 
 
    center: new google.maps.LatLng(0,0), 
 
    mapTypeId: google.maps.MapTypeId.ROADMAP, 
 
    }; 
 
    var map = new google.maps.Map(document.getElementById('map'), myOptions); 
 
    
 
    addStrictBoundsImage(map); 
 
} 
 

 
function addStrictBoundsImage(map){ 
 
\t var bounds = new google.maps.LatLngBounds(
 
\t \t new google.maps.LatLng(62.281819, -150.287132), 
 
\t \t new google.maps.LatLng(62.400471, -150.005608)); 
 

 
\t var image_src = 'https://developers.google.com/maps/documentation/' + 
 
\t \t 'javascript/examples/full/images/talkeetna.png'; 
 

 
\t var strict_bounds_image = new StrictBoundsImage(bounds, image_src, map); 
 
}
<script type="text/javascript" src="http://www.google.com/jsapi"></script> 
 
<script type="text/javascript"> 
 
    google.load("maps", "3",{other_params:"sensor=false"}); 
 
</script> 
 
<body style="margin:0px; padding:0px;" onload="initialise()"> 
 
\t <div id="map" style="height:500px; width:1000px;"></div> 
 
    <script type="text/javascript"src="https://raw.githubusercontent.com/matej-pavla/StrictBoundsImage/master/StrictBoundsImage.js"></script> 
 
</body>

0

Ecco una soluzione semplice che funziona attraverso mobile e desktop. Arresta la panoramica della mappa oltre la latitudine massima o minima del mondo e consente di impostare un livello minimo di zoom, che può aiutare a prevenire la visualizzazione di aree grigie con lo zoom troppo ampio (a seconda delle dimensioni impostate per la mappa):

(Si consiglia cautela nell'utilizzo dell'evento center_changed come suggerito nella risposta accettata da HenningJ. Nel mio caso il numero di eventi che questo ha causato errori di overflow dello stack in Google Chrome, è possibile utilizzare l'evento "dragend": sebbene ciò consentirà all'utente di trascinarsi all'esterno delle aree, e immediatamente lo "ricomincerà" su un'area valida della mappa).

var lastValidCenter; 
var minZoomLevel = 2; 

setOutOfBoundsListener(); 

function setOutOfBoundsListener() { 
     google.maps.event.addListener(map, 'dragend', function() { 
      checkLatitude(map); 
     }); 
     google.maps.event.addListener(map, 'idle', function() { 
      checkLatitude(map); 
     }); 
     google.maps.event.addListener(map, 'zoom_changed', function() { 
      checkLatitude(map); 
     }); 
}; 

function checkLatitude(map) { 
    if (this.minZoomLevel) { 
     if (map.getZoom() < minZoomLevel) { 
      map.setZoom(parseInt(minZoomLevel)); 
     } 
    } 

    var bounds = map.getBounds(); 
    var sLat = map.getBounds().getSouthWest().lat(); 
    var nLat = map.getBounds().getNorthEast().lat(); 
    if (sLat < -85 || nLat > 85) { 
     //the map has gone beyone the world's max or min latitude - gray areas are visible 
     //return to a valid position 
     if (this.lastValidCenter) { 
      map.setCenter(this.lastValidCenter); 
     } 
    } 
    else { 
     this.lastValidCenter = map.getCenter(); 
    } 
}