While Journey is a great utility for drawing a single path with all the features, it may sometimes be limiting. For instance, you may only draw one Journey
at a time, and subsequent calls to Journey.draw()
will overwrite the previous.
This guide demonstrates functionality which has changed with the release of Mappedin Web SDK v5.8.0.
drawPath()
,removePath()
, andremoveAllPaths()
has been deprecated and there is a new Paths Layer. Click here to read the up-to-date guide.
For full control over the route, draw the path using the drawPath()
method within the MapView
and pass it the directions.path
.
const startLocation = venue.locations.find( (location) => location.name === "ThinkKitchen");const endLocation = venue.locations.find( (location) => location.name === "American Eagle");
const directions = startLocation.directionsTo(endLocation);mapView.drawPath(directions.path);
This creates a basic path with no extra features. Using this method, you will need to handle both multi-floor navigation and multi-destination wayfinding manually using tooltips and by drawing multiple paths.
We can draw a secondary path the same way as the first while providing different start and end locations. To make this new path stand out, style it a different color by changing the color
property. The documentation for TPathOptions covers the other options available to you.
The CodeSandbox below demonstrates a single map with multiple destination paths.