En el trabajo necesitaba poner en un mapa varios puntos y seguidamente hacer un zoom y centrar la vista en medio de estos puntos.
Para esto he utilizado la siguiente función javascript, que me he creado. Es necesario llamar a la api de google maps versión 3.
Como podeis ver, es facilita, solo guardamos en unas variables la latitud y longitud máximas, latitud y longitud mínimas, con las que crearemos los puntos para el objeto bounds, el cual es una pareja de objetos latln. Uno será el punto SO, el de latitud longitud mínimos y el otro será el punto NE, el de latitud longitud máximo.
El paràmetro list és un array de JSON donde tenemos los diferentes datos del punto a añadir, tales como la latidud y longitud.
Una vez creado el bound, simplemente tenemos que pasárselo al mapa. Lo podemos hacer de la siguiente forma:
var map, bounds; map = new google.maps.Map(div, opts); /* div es el objeto en el cual se pintará el mapa. opts son las diferentes opciones de del mapa */ bounds = createBounds(list); map.fitBounds(bounds);
No és necesario hacer un map.setCenter(), porque ya lo hace automáticamente el fitBounds.
si deso que aparesca con un zoom definido, osea forzar a que salga con un zoom 10 por ejemplo ? como haria?
Hola Luis,
No puedes definir el zoom, ya que cuando creas los «bounds» representa un rectángulo en unidades geográficas que, así como lo has podido ver, lo he creado a partir de un listado de coordenadas. El rectángulo formado, contiene todas las coordenadas de la lista, con un zoom que las abarca todas. Si manipulas el zoom perderías visibilidad o mostrarías puntos que no «deberian» estar en el rectángulo.
Además, podrás ver en la API que el método no hay manera de asignarle el zoom.
https://developers.google.com/maps/documentation/javascript/reference#LatLngBounds
Espero haberte ayudado!
Saludos!