2012-03-27 14 views

risposta

13

function initialize() { 
 

 
var mapOptions = { 
 
\t center: new google.maps.LatLng(0, 0), 
 
\t zoom: 1, 
 
\t minZoom: 1 
 
}; 
 

 
var map = new google.maps.Map(document.getElementById('map'),mapOptions); 
 

 
var allowedBounds = new google.maps.LatLngBounds(
 
\t new google.maps.LatLng(85, -180), \t // top left corner of map 
 
\t new google.maps.LatLng(-85, 180) \t // bottom right corner 
 
); 
 

 
var k = 5.0; 
 
var n = allowedBounds .getNorthEast().lat() - k; 
 
var e = allowedBounds .getNorthEast().lng() - k; 
 
var s = allowedBounds .getSouthWest().lat() + k; 
 
var w = allowedBounds .getSouthWest().lng() + k; 
 
var neNew = new google.maps.LatLng(n, e); 
 
var swNew = new google.maps.LatLng(s, w); 
 
boundsNew = new google.maps.LatLngBounds(swNew, neNew); 
 
map .fitBounds(boundsNew); 
 

 
} 
 

 
google.maps.event.addDomListener(window, 'load', initialize);
#map { 
 
    width: 500PX; 
 
    height: 500px; 
 
}
<html> 
 
    <head> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
    <script src="https://maps.googleapis.com/maps/api/js"></script> 
 
    </head> 
 
    <body> 
 
    <div id="map"></div> 
 
    </body> 
 
</html>

// map zoom level should be 1 
+1

'swt' e' nor' sono variabili inutilizzate. Si prega di pulire il codice prima di incollare su SO. – developerbmw

+0

grazie @developerbmw – Kunal

+0

Ho provato questa soluzione su Android stesso, ma ho ottenuto un'eccezione: "java.lang.IllegalArgumentException: latitudine sud supera la latitudine nord (85.0> -85.0)". Dopo aver cambiato le coordinate, non si è arrestato, ma non mostra ancora il mondo intero. Come mai? Ecco una domanda al riguardo: http://stackoverflow.com/q/42329186/878126 –

5

Quando si crea una nuova istanza di mappa, è possibile specificare il livello di zoom.

var myOptions = { 
     zoom:7, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    } 
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

Più basso è il valore di zoom, il più grande della mappa che si vede, quindi un valore di 1 o 2 dovrebbe mostrare l'intero globo (a seconda delle dimensioni della mappa tela). Dopo aver creato la mappa, è possibile chiamare:

map.setZoom(8); 

Per modificare il livello di zoom.

+1

Il problema è che la dimensione della tela è relativo alla dimensione della finestra. Quindi sarebbe stato bello poter dire che dovrebbe mostrare tutto dalla coordinata A alla coordinata B. – Nocklas

+2

Inoltre, all'oggetto opzioni manca la proprietà 'center' che, secondo la [documentazione ufficiale] (https : //developers.google.com/maps/documentation/javascript/reference? hl = en # MapOptions), è richiesto. –

-2

La soluzione per questo problema era utilizzare il metodo fitBounds sull'oggetto mappa e specificare i limiti appropriati.

+4

Quali sono i limiti che hai usato? – httpete

3

Non è garantito di non avere ripete, ma abusando fatto la piastrella di base parte da 256 (zoom 0) e raddoppia ad ogni incremento lì in - te può selezionare il livello di zoom ottimale usando una funzione logaritmo.

function initialize() { 
 
    var mapOptions = { 
 
    center: new google.maps.LatLng(0, 0), 
 
    zoom: Math.ceil(Math.log2($(window).width())) - 8, 
 
    }; 
 
    
 
    var map = new google.maps.Map(document.getElementById('map'), mapOptions); 
 
} 
 

 
google.maps.event.addDomListener(window, 'load', initialize);
#map { 
 
    width: 100%; 
 
    height: 500px; 
 
}
<html> 
 
    <head> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
    <script src="https://maps.googleapis.com/maps/api/js"></script> 
 
    </head> 
 
    <body> 
 
    <div id="map"></div> 
 
    </body> 
 
</html>

Problemi correlati