在反应式Google地图中自定义DirectionsRenderer

时间:2019-05-26 12:15:46

标签: javascript reactjs react-google-maps

我想在react-google-maps中的DirectionsRenderer中更改标记的图标,或将路线的颜色更改为黑色。

这是我的无效代码:

<GoogleMap
    defaultZoom={7}
    defaultCenter={new google.maps.LatLng(35.74287570972717, 51.54944953647805)}
>
    {props.directions && <DirectionsRenderer
        defaultDirections={props.directions}
        directions={props.getDirection}
        onDirectionsChanged={()=>props.changeDirection(props.directions)}
    />}



</GoogleMap> changeDirection = (orgLat , orgLon , disLat , disLon) =>{

    const DirectionsService = new google.maps.DirectionsService();

    DirectionsService.route({

        origin: new google.maps.LatLng(orgLat, orgLon),
        destination: new google.maps.LatLng(disLat, disLon),
        travelMode: google.maps.TravelMode.DRIVING,
    }, (result, status) => {
        if (status === google.maps.DirectionsStatus.OK) {
            this.setState({
                directions: result,
            });
            console.log(this.state.directions)
        } else {
            console.error(`error fetching directions ${result}`);
        }
    });
}

谢谢

0 个答案:

没有答案