You will find many already answers showing how to build route with different colors on it how to change the color of route in google maps v3

I want to know how I can change the color once its already builded and rendered.

I have many different routes showing on the map, but I want to show red color or darker color, if this direction point is active and change other route colors to gray, until one of them are active.

code:

var directionsDisplay;

var directionsService = new google.maps.DirectionsService();

var map;



function initialize() {

  directionsDisplay = new google.maps.DirectionsRenderer({

    polylineOptions: {

      strokeColor: red

    }

  });



  var mapOptions = {

    zoom:7,

    mapTypeId: google.maps.MapTypeId.ROADMAP,

    center: {lat: 41.850033, lng: -87.6500523}

  }

  map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

  directionsDisplay.setMap(map);

}



function calcRoute() {

  var start = document.getElementById('start').value;

  var end = document.getElementById('end').value;

  var request = {

      origin:start,

      destination:end,

      travelMode: google.maps.DirectionsTravelMode.DRIVING

  };

  directionsService.route(request, function(response, status) {

    if (status == google.maps.DirectionsStatus.OK) {

      directionsDisplay.setDirections(response);

    }

  });

}



google.maps.event.addDomListener(window, 'load', initialize);

demo to show how its not working with two routes: http://jsfiddle.net/8xq4gd8y/15/