Zoom after routes Service.route?

Question

My code is:

directionsService.route(request, function (response, status) { if (status == google.maps.DirectionsStatus.OK) { directionsDisplay.setDirections(response); map.setZoom(2); } }); 

but setZoom (2) will not work. It seems that .setDirections is asynchronous. Can't set the zoom after tracking the route?

Tried also:

 google.maps.event.addListener(directionsDisplay, 'directions_changed', function () { map.setZoom(2); }); 

but the map will not scale ...

Answer 1

DirectionsService does not change the scale, and DirectionsDisplay (AKA DirectionsRenderer) does this.

The DirectionsRenderer has a preserveViewport option, which, if enabled and set to true, will not allow you to change the scale (and center) of the map.

If you want to set up a center based on the results of directionsService, see My answer to this similar question:

google map zoom after driving

If you want to set a center that would set a DirectionsRenderer, use the boundaries of the DirectionsResult.

You can also listen to the directions_changed event and set the scale when it fires, without knowing if it will work or not.

example from the documentation using the zoom_changed event

Answer 2

You can use the getMap () method and then set the scale for the map object as follows

var map = directionsDisplay.getMap(); directionsDisplay.setDirections(response); map.setZoom(12);

Worked for me!