new RouteManager(map, optionsopt)
RouteManager allows you to visualize route between two places on the map
which is represented as collection of line strings.
Route is created from one GeoJSON source into two layers. One with id "zoomedInRouteLine"
and one "zoomedOutRouteLine". Layer zoomedInRouteLine is visible when
current zoom level is greater than SteerpathMap.inspectionZoomLevel.
This layer will be filtered based on active buildings layerIndex value.
When current zoom level is smaller than SteerpathMap.inspectionZoomLevel zoomedOutRouteLine layer becomes visible.
This will represent the whole route in the map regardless of layer index or if the route goes into other building.
Example
var options = {
zoomedInRouteLineColor: "#1cb3a5",
zoomedOutRouteLineColor: "#df1d80",
altRouteLineColor: "#6b476a",
lineWidth: 10,
showRoutePreview: true,
handleUserInteractions: true,
animationSpeed: 0.01,
slowSpeedOnTurns: true,
numberOfAlternatives: 2
}
var routeManager = new steerpath.RouteManager(mapboxMap, options);
Properties:
Name | Type | Description |
---|---|---|
hasRoute |
boolean | Boolean value to indicate whether there's a route or not. |
altRoutes |
array | List of alternative routes. Each in it's own feature collection. |
instructions |
object | List of instructions along the route. f.e "Walk 4m and turn left". |
lineWidth |
number | Width of the route lines |
listOfPopUps |
array | Route Pop up objects represented in a list. |
numberOfAlternatives |
number | Number to indicate how many alternative routes should be visible |
pickedRoute |
object | FeatureCollection of the selected route. It is determined in setRoute() method |
popUpOptions |
object | Optional options whether or not pop ups should have close button or should they close when map is clicked. |
zoomedInRouteLineColor |
string | Hex Color value of the zoomed in route line. |
zoomedOutRouteLineColor |
string | Hex Color value of the zoomed out route line. |
route |
object | GeoJSON Feature collection of the route's coordinates and properties |
routeAnimationManager |
object | Instance of routeAnimationManager which handles the animation along the route. Check out RouteAnimationManager for the complete description of the methods and properties. |
Parameters
Name | Type | Attributes | Description | ||||||||||||||||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
map |
Map | Represents the map on your page. | |||||||||||||||||||||||||||||||||||||||||||||||||||
options |
object |
<optional> |
Properties
|
Methods
(static) getInstructions()
Returns the list of instructions of the route.
Each element in the list has two pro§perties: id and instruction.
Id matches with the RouteManager.route properties id.
Instruction object holds information to be shown to the user. For example "Walk 13m and turn right"
Example
routeManager.getInstructions()
(static) getRoute()
Returns the picked route as GeoJSON feature collection
Example
routeManager.getRoute()
(static) initRouteManager()
After giving directionsApi origin and destination and solveAll() has returned routes
you can make the routes visible by calling initRouteManager() method.
Based on the the setting of numberOfAlternatives value alternative routes will be drawn.
Each route will have a popup from which it can be selected to be picked route.
If numberOfAlternatives is set to 0 initRouteManager will call setRoute-method with default route
Example
routeManager.initRouteManager(routes)
(static) removeRoute()
Removes layers and sources of route and bluedot from the map.
After removing them RouteManager's property hasRoute will turn into false
and event steerpathRouteRemoved will be fired.
Example
routeManager.removeRoute()
(static) resetAnimation()
Will reset the time and distance related values
and after reset the animation will start from the beginning once startAnimation() gets called.
Example
routeManager.routeAnimationManager.resetAnimation()
(static) setRoute()
Sets the route to be pickedRoute and remove's alternatives from the map also add bluedot to the origin of the route.
Note that this will remove old route and bluedot from the map. If you want to remove routes yourself from the map
use removeRoute() method. After route is added RouteManager's property hasRoute will turn to true and event steerpathRouteAdded will be fired.
Example
routeManager.setRoute(route);
Returns
RouteManager instance