Situm’s Map Viewer allows you to fully personalize your user experience: setting your own fonts, changing UI colors, hiding UI elements, etc.
Opening the Settings Panel #
To do so, enter your Map Viewer URL (or try this one for testing purposes), and press CTRL+”,”. This will open a Settings menu like the following one:
Within this menu, you’ll find different sections, each section grouping options that share a common purpose (e.g. settings that modify the appearance are bundled together). You may click on each section/subsection to explore and find the options that you seek. Alternatively, you may use the search bar to type the name of the option you’re seeking.
Modifying a setting #
Modifying a setting is very easy. Just navigate through the Settings Panel, find your setting and change it. Don’t worry, your changes will be saved locally, you will not be actually changing your production map.
With most setting changes, the viewer will change instantly (e.g. when you change UI colours like in the following video). Other setting changes are more subtle: perhaps they just affect to corner cases, secondary screens, or maybe they control behaviour on certain use cases or circumstances.
All settings contain a brief explanation of what they do, but in case of doubt please write us at support@situm.com.
Saving your settings #
When you’re happy, you can click on the Download Config button and send the downloaded file to support@situm.com. We will happily load this new setting in your account.
Using your settings in your app #
The last step would be to use the configured settings in your web or mobile app. Once your settings are uploaded to your account, we will give you a “remote identifier”. This identifier is a string that uniquely identifies a settings configuration (you may have different configurations assigned to your account).
Web apps #
In a web app, you’ll be loading our Map Viewer either using an iFrame or an URL in the browser navigation bar. Either way, you’ll need to specify the remote identifier like this, where REMOTE_ID is your identifier (e.g. my_configuration_1234).
<iframe id="map-viewer-iframe" style="width:100%; height:600px" src="https://map-viewer.situm.com/id/YOUR_REMOTE_ID"> </iframe>
https://map-viewer.situm.com/id/YOUR_REMOTE_ID
Please remember that you may use different query params as well.
Mobile apps #
In a mobile app, you’ll need to pass the remote identifier to the Map Viewer component. Please take a look at this document to know how to do it.