title: Do not change map center or zoom level when rendering directions
body: <p>I want to have a large map of berlin from which you see multiple routes. Unfortunately a DirectionsRenderer zooms to the route so you have to manually zoom out again. </p>
  
  <p><strong>How do I avoid this behavior?</strong></p>
  
  <pre><code>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);
      });
  });
  </code></pre>
  
  <p><a href="http://jsfiddle.net/H3GE3/2/" rel="noreferrer">http://jsfiddle.net/H3GE3/2/</a></p>