2010-08-21 11 views
8

Por alguna razón, la función getBounds() para Google Maps v3 parece extenderse mucho más allá de lo que realmente muestra el mapa. Corrígeme si me equivoco, pero ¿no debería devolver las coordenadas de latitud y longitud NE (esquina superior derecha) y SW (esquina inferior izquierda) para las esquinas de lo que se muestra en la vista actual?Google Maps v3 getBounds se extiende más allá de lo visible en el mapa

Estoy devolviendo los resultados de búsqueda (que están mapeados por lat y lng) que están entre estas coordenadas y estoy siendo devuelto resultados mucho más allá del área devuelta por getBounds(). ¿Alguna idea sobre lo que podría estar pasando aquí?

Para su información, me estoy poniendo los límites en caso de inactividad del mapa:

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

var bounds = map.getBounds(); 
var NE = bounds.getNorthEast(); 
var SW = bounds.getSouthWest(); 

... y el uso de .lat() y .lng() para obtener las coordenadas de las esquinas respectivas. Luego lo paso a una consulta SQL que busca resultados entre esas coordenadas. Los resultados se encuentran en el área general, pero pueden quedar muy por debajo de lo que realmente se muestra en el mapa.

¡Se agradecen todas las ideas! ¡Gracias!

+0

NOTA: Esto fue en realidad debido a un error mucho más profundo con ciertos marcadores que se muestran/no se muestran y que están vinculados a un resultado de búsqueda incorrecto. Google, por supuesto, devolvía los resultados correctos. – Ryan

Respuesta

17

Correcto, el map.getBounds() devolverá los límites del área visible, como se muestra en el siguiente ejemplo. En este ejemplo, se dibuja un cuadro rojo Polyline utilizando los puntos de map.getBounds() cuando se desencadena el evento idle.

Es posible que su consulta SQL no esté devolviendo los resultados que está buscando y que deba volver a examinarse.

<!DOCTYPE html> 
<html> 
<head> 
<title>Bounds Box</title> 
<script type="text/javascript" 
    src="http://maps.google.com/maps/api/js?sensor=false"> 
</script> 
<script type="text/javascript"> 
     function initialize() { 

     var latlng = new google.maps.LatLng(30.405865,-87.283362); 
     var myOptions = { 
      zoom: 8, 
      center: latlng, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 
     var map = new google.maps.Map(document.getElementById("map_canvas"), 
      myOptions); 
     var viewportBox; 

     google.maps.event.addListener(map, 'idle', function(event) { 
      var bounds = map.getBounds(); 

      var ne = bounds.getNorthEast(); 
      var sw = bounds.getSouthWest(); 

      var viewportPoints = [ 
       ne, new google.maps.LatLng(ne.lat(), sw.lng()), 
       sw, new google.maps.LatLng(sw.lat(), ne.lng()), ne 
      ]; 
      /*strokeOpacity = 0 , if don't want to show the border moving. */ 
      if (viewportBox) { 
       viewportBox.setPath(viewportPoints); 
      } else { 
       viewportBox = new google.maps.Polyline({ 
        path: viewportPoints, 
        strokeColor: '#FF0000', 
        strokeOpacity: 1.0, 
        strokeWeight: 4 
       }); 
       viewportBox.setMap(map); 
      }; 

      var info = document.getElementById('info'); 
      info.innerHTML = 'NorthEast: ' + ne.lat() + ' ' + ne.lng() + 
       '<br />' + 'SouthWest: ' + sw.lat() + ' ' + sw.lng(); 
     }); 
     }; 
</script> 
</head> 
<body onload="initialize()"> 
    <div id="map_canvas" style="width:500px; height:500px"></div> 
    <div id="info"></div> 
</body> 
</html> 
+1

Sí, en realidad era un error diferente con los marcadores que me estaba confundiendo. Buena demostración para mostrar los límites, gracias. – Ryan

+0

+1 Buena respuesta @Eric :) –

+0

@Ryan ¿Has encontrado el error con los marcadores? ¡Estoy teniendo el mismo problema! –

Cuestiones relacionadas