Newly introduced in Micrio 4.0 is the replacement of the way you can interact with markers and tours from a classic imperative JavaScript API to a Svelte-inspired, store-based state management using SvelteStore.

This has greatly simplified the internal workings and has made the HTML interface fully reactive based on the image state instead of being interwoven in the previous JS API itself.

There are 2 State controllers:

1. State.Main: the main HTMLMicrioElement.state state controller, used for:
   • Getting and setting the active tour and marker
   • Loading and saving the entire current state as a minimal independent JSON object
2. State.Image: individual image MicrioImage.state controller, used for:
   • Setting the current opened marker in this image
   • Getting the image's last known viewport, even if it is not active at the moment

Please refer to this Micrio knowledge base article for if you want to upgrade an existing 3.x implementation to 4.x.