Google Maps API V3: mostrar todo el mundo

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

Fuente

2013-07-24 15:23:54 Kunal

+1

'swt' y' nor' son variables no utilizadas. Por favor, limpie el código antes de pegar en SO. – developerbmw

+0

gracias @developerbmw – Kunal

+0

Intenté esta solución en Android, pero obtuve una excepción: "java.lang.IllegalArgumentException: la latitud sur excede la latitud norte (85.0> -85.0)". Después de cambiar las coordenadas, no se bloqueó, pero todavía no muestra todo el mundo. ¿Cómo? Aquí hay una pregunta al respecto: http://stackoverflow.com/q/42329186/878126 –

5

Al crear una nueva instancia de mapa, puede especificar el nivel de acercamiento.

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

Cuanto menor sea el valor de zoom, más del mapa que se ve, por lo que un valor de 1 ó 2 debe mostrar todo el globo (dependiendo del tamaño de su mapa de lona). Después de crear el mapa, puede llamar a:

map.setZoom(8);

Para cambiar el nivel de acercamiento.

Fuente

2012-03-27 19:21:27 javram

+1

El problema es que el tamaño del lienzo es relativo al tamaño de la ventana. Así que hubiera sido agradable poder decir que debería mostrar todo, desde la coordenada A hasta la coordenada B. – Nocklas

+2

Además, al objeto de opciones le falta la propiedad 'center' que, según la [documentación oficial] (https : //developers.google.com/maps/documentation/javascript/reference? hl = es # MapOptions), es obligatorio. –

-2

La solución para este problema fue utilizar el método fitBounds en el objeto de mapa y especificar los límites apropiados.

Fuente

2012-12-04 22:31:33 Nocklas

+4

¿Cuáles son los límites que usaste? – httpete

3

No está garantizado para no tener repeticiones, pero abusando del hecho de la teja de base comienza en 256 (zoom 0) y se duplica en cada incremento de allí en en - te puede seleccionar el nivel de zoom óptimo usando una función de 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>

Fuente

2015-04-17 12:42:03

Google Maps API V3: mostrar todo el mundo

Respuesta

Cuestiones relacionadas