For documentation on the current version, please check Knowledge Base.
This is an old revision of the document!
Restoring Viewer State
Closing your host application usually means that the viewer component is destroyed and loses all state. The SDK offers a mechanism to a) be notified when you should save viewer state and b) restore the viewer using that state. These can be used to persist viewer state across host application sessions.
This “state” object is made available as a string.
Saving state
To listen for state changes, we listen to the onAppStateChanged
signal of the viewer. Save state whenever it changes.
// Listen to state changes viewer.onAppStateChanged.add(handleAppStateChanged); // Save state function handleAppStateChanged(state) { window.localStorage.etItem("m3dviewer_state",state); }
Loading state on startup
When creating the viewer, you have the ability to pass startup options. The available options are defined by the Constants
class. You can use the Constants.STARTUP_APP_STATE
startup option to restore a previously saved state.
Startup options can be provided only once, on viewer construction.
// Get a reference to some API elements we will use. var Constansts = orbitgt.mapping3d.sdk.viewer.Constants; var SDKViewer = orbitgt.mapping3d.sdk.viewer.SDKViewer; var AMap = orbitgt.mapping3d.sdk.viewer.AMap; // Prepare options and set state. var options = new AMap(); options.set(Constants.STARTUP_APP_STATE,window.localStorage.getItem("m3dviewer_state")); // Create viewer var appElement = document.getElementById("m3dviewer"); var viewer = new SDKViewer("example application",appElement,options);
Example
Below is a Javascript-specific example using window.localStorage
for storing state.
Try logging in to the viewer with “Remember me” checked, and refresh the page.
var viewer; /** * Called when something changes to the viewer state. */ function handleAppStateChanged(state) { // Save state somewhere... window.localStorage.setItem("m3dviewer_state",state); } /** * Called when the viewer component is ready for interaction. */ function handleReady() { // Listen to the state-changed signal viewer.onAppStateChanged.add(handleAppStateChanged); } /** * Called when the page is full loaded. */ function handleDOMReady() { // Create viewer startup options var options = new orbitgt.mapping3d.sdk.viewer.AMap(); options.set(orbitgt.mapping3d.sdk.viewer.Constants.STARTUP_APP_STATE,window.localStorage.getItem("m3dviewer_state")); // Create viewer var appElement = document.getElementById("m3dviewer"); viewer = new orbitgt.mapping3d.sdk.viewer.SDKViewer("example application",appElement,options); viewer.setSize(600,400); viewer.isReady.then(handleReady); } // Wait for page to load document.addEventListener("DOMContentLoaded", handleDOMReady);