javascript - georreferenciación - Google Maps API V3 método fitBounds()

google maps free api

Question

Tengo este código que representa un mapa.

function initialize() {
    var myOptions = {
      center: new google.maps.LatLng(45.4555729, 9.169236),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP,

panControl: true,
mapTypeControl: false,
panControlOptions: {
            position: google.maps.ControlPosition.RIGHT_CENTER
        },
zoomControl: true,
zoomControlOptions: {
    style: google.maps.ZoomControlStyle.LARGE,
    position: google.maps.ControlPosition.RIGHT_CENTER
},
scaleControl: false,
streetViewControl: false,
streetViewControlOptions: {
    position: google.maps.ControlPosition.RIGHT_CENTER
            }
        };
    var map = new google.maps.Map(document.getElementById("mapCanvas"),
        myOptions);



var Item_1 = new google.maps.LatLng(45.5983128 ,8.9172776);

var myPlace = new google.maps.LatLng(45.4555729, 9.169236);

var marker = new google.maps.Marker({
    position: Item_1, 
    map: map});

var marker = new google.maps.Marker({
    position: myPlace, 
    map: map});

var bounds = new google.maps.LatLngBounds(myPlace, Item_1);
map.fitBounds(bounds);

    }

Incluso si los dos puntos están separados de 25 km obtengo este resultado:

Mientras que me gustaría renderizar un zoom de mayor nivel.

Me gusta esto

Yo uso el método fitBounds ()

    var bounds = new google.maps.LatLngBounds(myPlace, Item_1);
    map.fitBounds(bounds);

Gracias por su apoyo

Answer 1

Esto sucede porque LatLngBounds() no toma dos puntos arbitrarios como parámetros, sino SW y NE

utilice el método .extend() en un objeto de límites vacío

var bounds = new google.maps.LatLngBounds();
bounds.extend(myPlace);
bounds.extend(Item_1);
map.fitBounds(bounds);

Demostración en http://jsfiddle.net/gaby/22qte/

Answer 2

Tengo el mismo problema que usted describe, aunque estoy construyendo mis LatLngBounds como se propuso anteriormente. El problema es que las cosas son asincrónicas y llamar a map.fitBounds() en el momento equivocado puede dejarte un resultado como en la Q. La mejor manera que encontré es colocar la llamada en un controlador inactivo como este:

google.maps.event.addListenerOnce(map, ''idle'', function() {
    map.fitBounds(markerBounds);
});

Answer 3

LatLngBounds deben definir con puntos en orden (sudoeste, noreste). Tus puntos no están en ese orden.

La solución general, especialmente si no sabes que los puntos definitivamente serán en ese orden, es extender un límite vacío:

var bounds = new google.maps.LatLngBounds();
bounds.extend(myPlace);
bounds.extend(Item_1);
map.fitBounds(bounds);

La API resolverá los límites.

Answer 4

 var map = new google.maps.Map(document.getElementById("map"),{
                mapTypeId: google.maps.MapTypeId.ROADMAP

            });
var bounds = new google.maps.LatLngBounds();

for (i = 0; i < locations.length; i++){
        marker = new google.maps.Marker({
            position: new google.maps.LatLng(locations[i][1], locations[i][2]),
            map: map
        });
bounds.extend(marker.position);
}
map.fitBounds(bounds);