new SteerpathMap(map, apiKey, optionsopt)
The SteerpathMap class is the main entry point to the Steerpath Web SDK and extends
the Mapbox GL Js to provide features relevant to indoor maps.
Internally the SteerpathMap instance monitors map movements and manages
which building is in focus and when the floor switcher should be shown.
Events are fired based on the states in the view before and after movement to make customization simple.
See the example below how to add Steetpath SDK into your application.
Example
//initialise Mapbox
mapboxgl.accessToken = "";
let mapboxMap = new mapboxgl.Map({
container: "mapboxMap",
style: "your_style_url_here",
center: [0, 0],
zoom: 1
});
//create instance of SteerpathMap
let steerpathMap = new steerpath.SteerpathMap(mapboxMap, apiKey);
//create floor switcher control and add it to the map
let floorSwitcher = new steerpath.FloorSwitcherControl(steerpathMap);
mapboxMap.addControl(floorSwitcher, "bottom-right");
Properties:
| Name | Type | Description | ||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
apiKey |
string | Your map data API key | ||||||||||||||||||||||||
buildings |
array | Array of building objects. | ||||||||||||||||||||||||
inspectionZoomLevel |
number | Min zoom level to start map view query. | ||||||||||||||||||||||||
inspectionBoundaries |
number | Size of the bounding box from which to query. For example 0.8 value means the bounding box will cover 80% of the whole map canvas. | ||||||||||||||||||||||||
isMapReset |
boolean | Boolean value to check if map view is reset i.e has active building or not. | ||||||||||||||||||||||||
latestActiveBuilding |
object | Latest active building object
Properties
|
||||||||||||||||||||||||
showFloorsWithSameIndex |
boolean | Boolean value to check if the selected floor should be shown in near by buildings. | ||||||||||||||||||||||||
filterPrefix |
string | Prefix for SteerpathMap to take into consideration when setting filters for Mapbox GL Draw in floor switching. |
Parameters
| Name | Type | Attributes | Description | ||||||||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
map |
Map | Represents the map on your page. | |||||||||||||||||||||||||||||||
apiKey |
ApiKey | Your map data API key | |||||||||||||||||||||||||||||||
options |
object |
<optional> |
Properties
|
Methods
(static) addLongTouch()
Add a LongTouchControl to the map.
Will fire an event steerpathLongTouch when user presses screen for 500ms.
(static) changeLayerIndex(buildingRef, layerIndex)
Change a building"s current floor. Fires steerpathBeforeLayerIndexChanged and steerpathLayerIndexChanged events.
Example
let buildingRef = steerpathMap.getActiveBuildingBuildingRef();
steerpathMap.changeLayerIndex(buildingRef, 2);
Parameters
| Name | Type | Description |
|---|---|---|
buildingRef |
string | The unique identifier for the building |
layerIndex |
number | The index of the floor that should become visible |
(static) getActiveBuildingBuildingRef()
Retrieve the buildingRef of current active building
Example
let buildingRef = steerpathMap.getActiveBuildingBuildingRef();
Returns
The building's buildingRef
(static) getActiveBuildingFloorLists()
Each building typically has multiple floors. Each floor is identified by a unique index number (integer) and has a
human readable short name which is used for example in the floor switcher. Use this method to retrieve the floor indexes and names
of the currently active building.
Example
let floorLists = steerpathMap.getActiveBuildingFloorLists();
Returns
A json object with two entries "floorIndexList" which is an array of the floor index numbers, and "floorNameList" which is an array of the floor names. The arrays are of the same length and their indices are in sync.
(static) getActiveBuildingLayerIndex()
Retrieve the current level index of the current active building.
Example
let layerIndex = steerpathMap.getActiveBuildingLayerIndex();
Returns
The index number of the current floor
(static) getBuildings()
Returns the collection of already seen buildings
Example
let buildingRef = steerpathMap.getBuildings();
Returns
List of buildings
(static) getSteerpathBuildingFromFixedPosition(point, updateMapViewopt)
Queries map in fixed position and returns the building JSON object if there was any.
If second parameter updateMapView is set to true the view will update.
Example
//Queries the map view from the center point and updates the view.
let point = [
mapboxMap._canvas.clientWidth / 2,
mapboxMap._canvas.clientHeight / 2
];
let building = steerpathMap.getSteerpathBuildingFromFixedPosition(point, true)
Parameters
| Name | Type | Attributes | Default | Description |
|---|---|---|---|---|
point |
point | [x,y] point to query view from. | ||
updateMapView |
boolean |
<optional> |
false | Boolean value to determine if map view should be updated. Default is set to false. |
Returns
Found building in the view.
(static) getSteerpathBuildingFromView()
Method to query map view from Steerpath building.
Is used on map moveend and map onload-events.
Example
let buildingInTheView = steerpathMap.getSteerpathBuildingFromView();
Returns
Found building in the view.
(static) hideActiveBuilding()
"Close" the currently active building, resetting the building related state. Fires steerpathBuildingExit event. Does not move the map.
Example
steerpathMap.hideActiveBuilding();
(static) queryForSteerpathBuilding(analyseQueriedViewopt)
Method to query map view from Steerpath building and update the view if one is found.
Is used on map moveend and map onload-events.
Example
let buildingInTheView = steerpathMap.queryForSteerpathBuilding(true);
Parameters
| Name | Type | Attributes | Default | Description |
|---|---|---|---|---|
analyseQueriedView |
boolean |
<optional> |
false | Boolean value to determine if map view should be updated based on the found building. Default is set to false. |
Returns
Found building in the view.
(static) setBuildingDefaultLayerIndex(buildingRef, defaultLayerIndex) → {object}
Set which floor is displayed when this specified building first becomes the active building. The default value is which ever floor has a floor index closest to zero.
Example
let options = {
inspectionZoomLevel: 16,
inspectionBoundaries: 0.4,
showFloorsWithSameIndex: false
};
let steerpathMap = new steerpath.SteerpathMap(mapboxMap, options);
//after you have your instance of the SteerpathMap set a new defaultLayerIndex for your building
steerpathMap.setBuildingDefaultLayerIndex("your_building_ref" , 2);
let floorSwitcher = new steerpath.SteerpathFloorSwitcherControl(steerpath);
mapboxMap.addControl(floorSwitcher, "bottom-right");
Parameters
| Name | Type | Description |
|---|---|---|
buildingRef |
string | The unique identifier for the building |
defaultLayerIndex |
number | The floor index which should be shown by default when the building becomes the active building. |
Returns
a JSON object describing the building with the properties "buildingRef", "latestLayerIndex", "defaultLayerIndex", "floorLists"
- Type
- object
(static) setInspectionBoundaries(inspectionBoundaries) → {object}
Sets the size of the bounding box from which to query. For example 0.8 value means the bounding box will cover 80% of the whole map canvas.
Example
steerpathMap.setInspectionBoundaries(0.8);
Parameters
| Name | Type | Description |
|---|---|---|
inspectionBoundaries |
number | Size of the bounding box from which to query. For example 0.8 value means the bounding box will cover 80% of the whole map canvas. |
Returns
SteerpathMap - Instance of SteerpathMap
- Type
- object
(static) setInspectionZoomLevel(zoomLevel) → {object}
Sets the min zoom level from which the SteerpathMap will query for Steerpath buildings
Example
steerpathMap.setInspectionZoomLevel(18);
Parameters
| Name | Type | Description |
|---|---|---|
zoomLevel |
number | Min zoom level to start map view query. |
Returns
SteerpathMap - Instance of SteerpathMap
- Type
- object
(static) setShowFloorsWithSameIndex(shouldShowFLoorsWithSameIndex) → {object}
Sets the boolean value to check if the selected floor should be shown in near by buildings.
Example
steerpathMap.setShowFloorsWithSameIndex(true);
Parameters
| Name | Type | Description |
|---|---|---|
shouldShowFLoorsWithSameIndex |
boolean | Boolean value to check if the selected floor should be shown in near by buildings. |
Returns
SteerpathMap - Instance of SteerpathMap
- Type
- object