[ACCEPTED]-change the color of the polyline in DirectionsRenderer-google-maps-api-3

Accepted answer
Score: 21

At global declarations

var polylineOptionsActual = new google.maps.Polyline({
    strokeColor: '#FF0000',
    strokeOpacity: 1.0,
    strokeWeight: 10
    });

At initialise

function initialize() {
   directionsDisplay = new google.maps.DirectionsRenderer({polylineOptions: polylineOptionsActual});    

0

Score: 9

In answer marked as resolved I see that 5 object Polyline used for polylineOptions. In 4 my case I use the next code

new google.maps.DirectionsRenderer({ suppressMarkers: true, polylineOptions: { strokeColor: '#5cb85c' } });

The difference 3 is that I assign polylineOptions, not Polyline object. Not sure 2 it could be helpful, but decided to add 1 these answer.

Score: 3

@Seacat, after you update the directionsRenderer 3 with the new polylineOptions, you have to 2 re-render the directions response which 1 is stored inside the renderer object..

directionsRenderer.setDirections(directionsRenderer.directions);
Score: 3

Using setOptions(options:DirectionsRendererOptions) makes code more readable. The coding 1 would be:

At global level:

var directionsDisplay;

Inside initialize() method:

var polyline = new google.maps.Polyline({
    strokeColor: '#C00',
    strokeOpacity: 0.7,
    strokeWeight: 5
    });
directionsDisplay = new google.maps.DirectionsRenderer();
directionsDisplay.setOptions({polylineOptions: polyline}); 
now directionDisplay can be used in any method with the custom poly line.

More Related questions