Google Maps Api v3-getBounds no está definido


Estoy cambiando de v2 a v3 google maps api y tengo un problema con la función gMap.getBounds().

Necesito obtener los límites de mi mapa después de su inicialización.

Aquí está mi código javascript:


var gMap;
$(document).ready(

    function() {

        var latlng = new google.maps.LatLng(55.755327, 37.622166);
        var myOptions = {
            zoom: 12,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        gMap = new google.maps.Map(document.getElementById("GoogleMapControl"), myOptions);

        alert(gMap.getBounds());
    }
);

Así que ahora me alerta que gMap.getBounds() no está definido.

He intentado obtener valores getBounds en el evento click y funciona bien para mí, pero no puedo obtener los mismos resultados en el evento load map.

También getBounds funciona bien mientras el documento se está cargando en Google Maps API v2, pero falla en V3.

¿Podría ayudarme a resolver este problema?

Author: Philip Kirkbride, 2010-05-14

5 answers

En los primeros días de la API v3, el método getBounds() requería que los mosaicos del mapa hubieran terminado de cargarse para que devolviera los resultados correctos. Sin embargo, ahora parece que puedes escuchar el evento bounds_changed, que se dispara incluso antes del evento tilesloaded:

<!DOCTYPE html>
<html> 
<head> 
   <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
   <title>Google Maps v3 - getBounds is undefined</title> 
   <script src="http://maps.google.com/maps/api/js?sensor=false" 
           type="text/javascript"></script> 
</head> 
<body> 
   <div id="map" style="width: 500px; height: 350px;"></div> 

   <script type="text/javascript"> 
      var map = new google.maps.Map(document.getElementById("map"), {
         zoom: 12,
         center: new google.maps.LatLng(55.755327, 37.622166),
         mapTypeId: google.maps.MapTypeId.ROADMAP
      });

      google.maps.event.addListener(map, 'bounds_changed', function() {
         alert(map.getBounds());
      });
   </script> 
</body> 
</html>
 125
Author: Daniel Vassallo,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-10-25 00:25:57

Debería estar funcionando, al menos de acuerdo con la documentación de getBounds(). Sin embargo:

var gMap;
$(document).ready(function() {
    var latlng = new google.maps.LatLng(55.755327, 37.622166);
    var myOptions = {
        zoom: 12,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    gMap = new google.maps.Map(document.getElementById("GoogleMapControl"), myOptions);
    google.maps.event.addListenerOnce(gMap, 'idle', function(){
        alert(this.getBounds());
    });
});

Véalo funcionando aquí.

 20
Author: Salman A,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-05-14 09:27:33

Estaba diciendo que la solución de Salman es mejor porque el evento idle se llama antes que el tilesloaded, ya que espera a que se carguen todas las fichas. Pero en una mirada más cercana, parece bounds_changed se llama incluso antes y también tiene más sentido, ya que estás buscando los límites, ¿verdad? :)

Así que mi solución sería:

google.maps.event.addListenerOnce(gMap, 'bounds_changed', function(){
    alert(this.getBounds());
});
 14
Author: treznik,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2012-05-22 10:07:24

En otros comentarios aquí, se aconseja usar el evento "bounds_changed" sobre "idle", con lo que estoy de acuerdo. Ciertamente bajo IE8 que activa "idle" antes de "bounds_changed" en mi máquina de desarrollo al menos, dejándome con una referencia a null en getBounds.

Sin embargo, el evento "bounds_changed" se activará continuamente cuando arrastre el mapa. Por lo tanto, si desea utilizar este evento para comenzar a cargar marcadores, será pesado en su servidor web.

Mi solución multi navegador a este problema:

google.maps.event.addListenerOnce(gmap, "bounds_changed", function(){
   loadMyMarkers();
   google.maps.event.addListener(gmap, "idle", loadMyMarkers);
});
 10
Author: Almer,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2012-01-11 11:32:04

Bueno, no estoy seguro si llego demasiado tarde, pero aquí está mi solución usando gmaps.js plugin:

map = new GMaps({...});

// bounds loaded? if not try again after 0.5 sec
var check_bounds = function(){

        var ok = true;

        if (map.getBounds() === undefined)
            ok = false;

        if (! ok) 
            setTimeout(check_bounds, 500);
        else {
             //ok to query bounds here
              var bounds = map.getBounds();
        }   
    }

    //call it
    check_bounds();
 1
Author: Fernando,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2013-10-22 19:19:24