使用DirectionsRenderer时如何在点之间更改strokeColor [英] How to change strokeColor between points when using DirectionsRenderer

问题描述

我正在使用react-google-maps在网站中呈现地图.使用DirectionsService的航路点时，每行的笔触颜色都有问题.如何更改它们之间的strokeColor以及使用DirectionsService之后如何回调.这是我的原始示例:

I'm using react-google-maps to render map in website. I have a problem about strokeColor for each line when using waypoints for DirectionsService. How to change strokeColor between them and how to callback after using DirectionsService . This is my source same example:

https://tomchentw.github.io/react-google-maps/#directionsrenderer

 let DirectionsService = new google.maps.DirectionsService;
 var directionsDisplay = new google.maps.DirectionsRenderer;
DirectionsService.route(
    {
        origin: new google.maps.LatLng(10.8441402, 106.76757429999999),
        destination: new google.maps.LatLng(10.8463797,106.7721405),
        travelMode: google.maps.TravelMode.DRIVING,
        optimizeWaypoints: true,


        waypoints: [
             {
                 location: new google.maps.LatLng(10.8454946,106.764759),
                 stopover : false
             }
         ]
    },
    (result, status) => {
        console.log(result);
        if (status === google.maps.DirectionsStatus.OK) {
             this.setState({directions: result})
            return (typeof callback == 'function') && callback( result);
        } else {
            console.error(`error fetching directions`, result);
        }
    }
);

感谢帮助

推荐答案

要在组件中正确访问DirestionsRendererOptions，您需要使用options prop，如下所示:

In order access DirestionsRendererOptions right in component, you need to use options prop, like that:

<DirectionsRenderer
  directions={props.directions}
  options={{
      polylineOptions: {
          strokeOpacity: 0.5,
          strokeColor: '#FF0000',
      },

  }}
/>

请参阅文档，以了解有关您有权使用的选项的更多信息: https://developers.google.com/maps/documentation/javascript/reference/3.exp/directions#DirectionsRendererOptions

Please see the documentation to find out more about the options you have access to: https://developers.google.com/maps/documentation/javascript/reference/3.exp/directions#DirectionsRendererOptions

这篇关于使用DirectionsRenderer时如何在点之间更改strokeColor的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！