No cambie el centro del mapa ni el nivel de zoom al representar direcciones
Resuelto
asked hace 11 años
•
2 respuestas
Quiero tener un mapa grande de Berlín desde el que se vean múltiples rutas. Desafortunadamente, un DirectionsRenderer hace zoom en la ruta, por lo que tienes que alejarte manualmente nuevamente.
¿Cómo evito este comportamiento?
var $canvas = document.querySelector('#map');
var map = new google.maps.Map($canvas, {
center: new google.maps.LatLng(52.46004869999999, 13.37898690),
mapTypeId: google.maps.MapTypeId.ROADMAP,
zoom: 14
});
var routes = [
{
origin: new google.maps.LatLng(52.459281, 13.356367),
destination: new google.maps.LatLng(52.455833, 13.322948),
travelMode: google.maps.TravelMode.BICYCLING
},
{
origin: new google.maps.LatLng(52.597621, 13.430536),
destination: new google.maps.LatLng(52.5918799, 13.2832929),
travelMode: google.maps.TravelMode.BICYCLING
}
];
routes.forEach(function(route) {
new google.maps.DirectionsService().route(route, function(body) {
var display = new google.maps.DirectionsRenderer();
display.setMap(map);
display.setDirections(body);
});
});
http://jsfiddle.net/H3GE3/2/
Aceptado
Utilice la opción preserveViewport de DirectionsRenderer para evitar el zoom automático de la ruta, luego configure la ventana gráfica que desee.
{preserveViewport: true}
O si lo desea, calcule la unión de los límites de las respuestas de las direcciones y ajuste el mapa a eso.
var bounds = new google.maps.LatLngBounds();
routes.forEach(function(route) {
new google.maps.DirectionsService().route(route, function(body) {
var display = new google.maps.DirectionsRenderer({preserveViewport: true});
display.setMap(map);
display.setDirections(body);
bounds.union(body.routes[0].bounds);
map.fitBounds(bounds);
});
});
prueba de concepto violín
fragmento de código:
Mostrar fragmento de código