Woosmap for React Native - Driving Directions
Get distance, duration and path polyline for a pair of origin and destination, based on the recommended transit route between those two points.
You can calculate directions and plot by using the WoosmapView.route method. This method is an interface to the Route endpoint of Woosmap Distance API. This service compute travel distance, time and path for a pair of origin and destination.
You can use the WoosmapView.setRoute method to display these results.
import {
WoosmapView,
MapController,
LatLngBounds,
WoosPadding,
LatLng,
DirectionRequest
} from '@woosmap/react-native-woosmap';
// ...
<WoosmapView
ref={mapRef}
mapOptions={mapOptions}
wooskey={'Your Woosmap key'}
routeIndex_changed={(routeInfo) => {
console.log(`route Index changed ${JSON.stringify(routeInfo)}`);
}}}
/>
To display route on map.
mapRef.current?.route(
{
origin: { lat: 48.86288, lng: 2.34946 },
destination: { lat: 52.52457, lng: 13.42347 },
provideRouteAlternatives: true,
travelMode: 'driving',
unitSystem: 'metric',
}
)
.then((result) => {
console.log(JSON.stringify(result));
mapRef.current?.setRoute(result);
});
To clear displayed route on map.
mapRef.current?.setRoute(undefined);
Please check the javascript guide for more implementation. javascript guide
Get Transit Route
You can calculate transit route by using the TransitService object. This object is an interface to the Route endpoint of Woosmap Transit API. This service compute travel distance, time and path for a pair of origin and destination.
if (mapRef.current) {
let api = new WoosmapApi({ publicKey: appConstants.woosmap_key });
api.Transit.route({
origin: { lat: 45.467, lng: 9.0516 },
destination: { lat: 45.4599, lng: 9.2822 },
modes: [
`highSpeedTrain`,
`intercityTrain`,
`interRegionalTrain`,
`regionalTrain`,
`cityTrain`,
`bus`,
`ferry`,
`subway`,
`lightRail`,
`privateBus`,
`inclined`,
`aerial`,
`busRapid`,
`monorail`,
`flight`,
`spaceship`,
],
})
.then((result: TransitRouteResponse) => {
//console.log(JSON.stringify(result));
mapRef.current?.setTransitRoute(result);
})
.catch((err) => {
Alert.alert('Transit Direction', `Error: ${err.message}`);
});
}
To clear displayed route on map.
if (mapRef.current) {
mapRef.current?.setTransitRoute(undefined);
}
Please check the javascript guide for more implementation. javascript guide