Skip to content

Micrio client Events API Client 4.x

WARNING

This page is about the Micrio client version 4. Use the links below to navigate to other versions.

Since the <micr-io> element is an instance of the generic HTMLElement class, this means that all HTMLElement APIs can also be used with <micr-io>.

Reading events

All Micrio-specific events (CustomEvent) fire on the <micr-io> HTML element itself. So for instance, if you want to listen to a marker-opened event, you can do this:

js
// Your HTML element reference
const image = document.querySelector('micr-io');

// Add the event listener
image.addEventListener('marker-opened', e => {
	console.log('Marker was opened!', e.detail);
});

List of event

Event nameevt.detail valueDescription

General

showHTMLMicrioElementThe main Micrio image is loaded and fully shown
loadMicrioImageIndividual image data is loaded and Micrio will start rendering

Camera events

zoomFloat64ArrayThe camera has zoomed
moveViewThe camera has moved
draw-A frame has been drawn
resizeDOMRectA frame has been drawn

Markers

marker-openMarker JSONA marker has been opened and the camera animation is starting
marker-openedMarker JSONA marker has been fully opened and the camera is done, and popup shown
marker-closeMarker JSONA marker starts closing
marker-closedMarker JSONA marker has been succesfully closed

Marker Tours and Video Tours

tour-startTour JSONA tour has been succesfully started
tour-stepMarkerTour JSONFires for each marker step in a marker tour
tour-stopTour JSONA tour has been succesfully stopped
tour-eventVideoTourEvent JSONWhen a video tour has custom events, they will be fired like this

Main media (video, audio)

audio-init-The audio controller has been succesfully initialized and can play audio
audio-mute-The audio has been muted
audio-unmute-The audio has been unmuted
autoplay-blocked-Fires when there is autoplay audio or video which was disallowed by the browser
media-play-Media has started playing
media-pause-Media has stopped playing
timeupdatenumberA media timeupdate tick

Splitscreen views

splitscreen-start-Split screen mode has started
splitscreen-stop-Split screen mode has stopped

Special cases

updateArray<event-types>When there is any user action, this event fires. This event is deferred and will fire at a maximum rate of every 500ms. The evt.details is an array of event types fired within the interval.