API Overview

The Voyager Explorer component has attributes and methods that help you to externally configure and control it. This makes it easier to integrate into your own custom application.

Loading Attributes

These attributes configure the initial object load of the component.

Name Options Description
root Valid URL Path to the root folder (base folder for all assets)
document Valid URL Path to the SVX scene descriptor JSON document to load (relative to the root folder).
model Valid URL URL of a model (supported formats: gltf, glb) to load and display at startup (relative to the root folder). Note: Uncommon - Used when loading a model with no SVX ‘document’ specified.
geometry Valid URL URL of a geometry (supported formats: obj, ply) to load and display at startup (relative to the root folder). Note: Uncommon - Used when loading a model with no SVX ‘document’ specified.
texture Valid URL If a geometry URL is given, optional URL of a color texture to use with the geometry (relative to the root folder).
dracoRoot Valid URL Path to the Draco compression libraries used for glTF models. Defaults to Google CDN.
resourceRoot Valid URL Path to root folder where the Voyager assets are stored (fonts,images,language). Defaults to jsDelivr CDN.
bgColor Valid CSS colors Sets the color of the component background. Optional second color for gradient styles. Ex: “red” or “red rgb(0,255,0)”
bgStyle Solid, LinearGradient, RadialGradient Sets the style of the component background.
controls True, False Enables/Disables user-driven camera controls. Defaults to ‘True’. Useful if driving navigation from external code.
prompt True, False Enables/Disables user interaction prompt. Defaults to ‘True’. Always false if ‘controls’ is false.
reader True, False Enables/Disables visibility of reader UI. Defaults to ‘True’. Overrides activation triggers like toggleReader()
lang valid ISO 639-1 code Sets the active language of the component (where available)
dragdrop If present, enables dragging and dropping files into Story. Enabled by default in Standalone mode. Note: Voyager does not handle access control. Enabling this feature increases the importance of securing your server-side I/O.

UI Attributes

Name Options Description
uiMode Any combination of EUIElements . Use “|” to concatenate multiple options. E.g. “none|title” to show just the scene title. Configures what UI elements should be visible on initial component render. By default all elements are shown.

UI Methods

Name Parameters Description
setBackgroundStyle( style ) style: Solid, LinearGradient, RadialGradient Sets the style of the component background.
setBackgroundColor( color0, color1[optional] ) color0, color1: any valid css color Sets the color of the component background. Optional second color for gradient styles.

Feature Methods

These methods engage Voyager functionality without the native UI.

Name Parameters Description
toggleAnnotations() None On/off toggle for visibility of model annotations (if available)
toggleReader() None On/off toggle for the article reader.
toggleTours() None On/off toggle for the tour functionality UI.
toggleTools() None On/off toggle for the extended tools panel at the bottom of the UI
toggleMeasurement() None On/off toggle for visibility of the object measurement tool.
enableAR() None Requests an AR session (if available, outcome depends on platform) *Due to browser security precautions, this will not work if the component is served in a cross-domain iframe
setActiveAnnotation( id ) id: unique id string Activates the annotation with the provided id. Opens annotation content where style permits.
setActiveArticle( id ) id: unique id string Activates the article with the provided id. Bad/missing id opens article list.
setTourStep( tourIdx, stepIdx, interpolate[optional] ) tourIdx, stepIdx: valid integer - interpolate: boolean Activates the scene state found at the provided tour and step index. Optional ‘interpolate’ parameter to control if transition is animated. Defaults to true.
setLanguage( id ) id: valid ISO 639-1 code string Changes the active Voyager language to the supplied id if available in the current scene.

Methods for external control over camera properties and navigation.

Name Parameters Description
setCameraOrbit( yaw, pitch ) yaw, pitch: angle in degrees Sets yaw and pitch of orbit navigation.
getCameraOrbit( type[optional] ) type: min, max, active (default) Returns an array [yaw, pitch] in radians.
setCameraOffset( x, y, z ) x, y, z: coordinate in scene units Sets offset of orbit navigation.
getCameraOffset( type[optional] ) type: min, max, active (default) Returns an array [x, y, z] in scene units.

Misc Methods

Name Parameters Description
getArticles() None Returns an array of Article data objects with properties of each article associated with the current scene.
getAnnotations() None Returns an array of Annotation data objects for the current scene.

Events

Name Description
annotation-active This event is fired when the active state of an annotation changes. event.detail will contain the ID of the activated annotation, or will be empty if no annotation is active.
model-load This event fires every time a model finishes loading. event.detail will contain the quality (EDerivativeQuality) of the loaded model. This will likely fire multiple times depending on the number of derivatives loaded and unloaded.