Comment on page
Configuration
The Map Template can be configured through a wide range of properties which ensures that the final version of the map will fit your user's needs.
The MapsIndoors Map component supports a list of props (see the list below) that can be configured in the
App.jsx file.When loading the MapsIndoors Map component for the first time, the map will respect the default values set for the
apiKey, venue, logo and primaryColor props, which can be found in the MapsIndoorsMap.jsx file under the defaultProps object.Note that when using the React component, the properties should conform to JSX prop naming, eg.
api-key becomes apiKey.Attribute | React prop name | Type | Description |
|---|---|---|---|
api-key | apiKey | string | The MapsIndoors Solution you want to load. Takes both API key as string and "App alias". |
gm-api-key | gmApiKey | string | Your Google Maps API key. |
mapbox-access-token | mapboxAccessToken | string | Your Mapbox Access Token. Setting it will load a Mapbox map. If you set both a Mapbox Access Token and Google Maps API key, the Mapbox Access Token takes precedence. |
venu | venue | string | The Venue to load from your MapsIndoors Solution. |
location-id | locationId | string | Set a MapsIndoors Location ID to show it on the map and its details in the sheet. |
primary-color | primaryColor | string | The primary color to use throughout the app. |
logo | logo | string | The logo to show during initial load. |
app-user-roles | appUserRoles | array | A list of App User Roles to apply when loading data. Used like so: appUserRoles={["App User Role"]} |
directions-from | directionsFrom | string | Set a MapsIndoors Location ID or the string USER_POSITION to be used as origin to instantly show directions. |
directions-to | directionsTo | string | Set a MapsIndoors Location ID or the string USER_POSITION to be used as destination to instantly show directions. |
external-IDs | externalIDs | array | Array of external IDs which filters the map and shows a list of locations. Because of the way browsers work, you cannot use External IDs with the ,, & , # and + characters in them, as they are interpreted by the browser in a particular way. |
tile-style | tileStyle | string | Name of Tile Style to display on the map |
start-zoom-level | startZoomLevel | number | The initial zoom level of the map |
supports-url-parameters | supportsUrlParameters | bool | Indicates if the Map Template supports URL parameters. |
gm-map-id | gmMapId | string | The Google Maps Map ID associated with a specific map style or feature. |
pitch | pitch | number | The pitch (Mapbox) or tilt (Google) value of the map. The value of the pitch can be between 0-85 degrees on a Mapbox map. |
bearing | bearing | number | The bearing (Mapbox) or heading (Google) value of the map. It accepts any value, and will modify it to fit into the range [0, 360]. |
Last modified 15d ago