editable samplecode如何在以下代码中使用航点 航点是否有助于绘制我在数据库中更新的方式,无论 ponits 将基于我更新的点
const DirectionsService = new google.maps.DirectionsService();
const DirectionsDisplay = new google.maps.DirectionsRenderer({suppressMarkers: true},{strokeColor:"#4a4a4a"});
DirectionsService.route({
origin: new google.maps.LatLng(this.state.orgin.latitude ,this.state.orgin.longitude),
destination: new google.maps.LatLng(this.state.destination.latitude ,this.state.destination.longitude),
travelMode: google.maps.TravelMode.DRIVING,
},
(result, status) => {
if (status === google.maps.DirectionsStatus.OK) {
this.setState({
directions: result,
});
} else {
console.error(`error fetching directions ${result}`);
}
});
}).catch(function (err) {
});
}
})
)(props =>
<GoogleMap
defaultZoom={50}>
<DirectionsRenderer directions={props.directions} />
< Marker
position={{ lat:props.delivery!=undefined?props.delivery.latitude:null, lng: props.delivery!=undefined?props.delivery.longitude:null }} />
</GoogleMap>
);
return (
<MapWithADirectionsRenderer />
)
}
最佳答案
您可以通过在您的路线请求中添加 waypoints[] 的 DirectionsWaypoint 数组来添加航点。
您可以查看此文档以了解更多信息:https://developers.google.com/maps/documentation/javascript/directions#DirectionsRequests
这是一个示例航点数组:
waypoints: [
{
location: new google.maps.LatLng(14.546748, 121.05455)
},
{
location: new google.maps.LatLng(14.552444,121.044488)
}
]
这是带有航点的示例方向请求:
DirectionsService.route({
origin: new google.maps.LatLng(14.533593, 121.053128),
destination: new google.maps.LatLng(14.550895, 121.025079),
travelMode: google.maps.TravelMode.DRIVING,
waypoints: [
{
location: new google.maps.LatLng(14.546748, 121.05455)
},
{
location: new google.maps.LatLng(14.552444,121.044488)
}
]
}, (result, status) => {
if (status === google.maps.DirectionsStatus.OK) {
this.setState({
directions: result,
});
} else {
console.error(`error fetching directions ${result}`);
}
});
关于google-maps-api-3 - 在 react-google-maps 中添加航点,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47513308/