在Google Map API的多条路线中单击任意一条路线时，更改路线的颜色

Question

我已经使用Google Map API创建了多条路线。

我需要更改颜色并突出显示路线，同时单击Google地图中的任何路线。

///为多条路线添加了代码。

let directionsService = new google.maps.DirectionsService;
let directionsDisplay;
directionsService.route({
  origin: {
    lat: sourceLat,
    lng: sourceLon
  },
  destination: {
    lat: destLat,
    lng: destLon
  },
  provideRouteAlternatives: true,
  travelMode: google.maps.TravelMode['DRIVING']
}, (res, status) => {
  if (status == google.maps.DirectionsStatus.OK) {
    for (var i = 0, len = res.routes.length; i < len; i++) {
      directionsDisplay = new google.maps.DirectionsRenderer({
        map: this.map,
        directions: res,
        routeIndex: i,
        suppressMarkers: true,
        polylineOptions: {
          strokeColor: "darkgrey",
          strokeOpacity: 1.0,
          strokeWeight: 7
        }
      });
    }
  }
});

///添加了事件监听器以更改路线颜色。但这不起作用，也没有出现任何错误。

google.maps.event.addListener(directionsDisplay, 'click', function(event) {

  directionsDisplay.setOptions({
    map: this.map,
    directions: res,
    routeIndex: 0,
    polylineOptions: {
      strokeColor: 'green',
      strokeOpacity: 1.0,
      strokeWeight: 7
    }
  });

  directionsDisplay.setMap(this.map);
});

谢谢。