Class Viewer

The main exposed object. This is the entry point into the application

const canvas = document.getElementById( 'babylon-canvas' );
const viewer = Viewer( canvas, '/path/to/index.json' );

The class does nothing on its own and needs to bootstrap

Hierarchy

EventBroadcaster
- Viewer

Constructors

constructor

new Viewer(canvas: HTMLCanvasElement, structureJson: string | StructureJson): Viewer
Constructor
Parameters
- canvas: HTMLCanvasElement
- structureJson: string | StructureJson
Returns Viewer
Overrides EventBroadcaster.constructor
- Defined in src/api/classes/viewer.ts:147

Properties

`Readonly` canvas

canvas: HTMLCanvasElement

`Readonly` eventEmitter

eventEmitter: EventEmitter<string | symbol, any>

`Static` `Readonly` BOUNDING_BOX_NAME

BOUNDING_BOX_NAME: "__bounding_box__" = '__bounding_box__'

`Static` version

version: string = buildInfo.version

Accessors

animationManager

get animationManager(): AnimationManager
Gets the AnimationManager attached to the viewer.

Throws
Error if the AnimationManager has not been initialized.

Returns AnimationManager
- Defined in src/api/classes/viewer.ts:232

cloneMaterialsOnMutation

get cloneMaterialsOnMutation(): boolean
Gets the cloneMaterialsOnMutation flag, as defined in the spec

Returns boolean
- Defined in src/api/classes/viewer.ts:249

engine

get engine(): Engine
Gets the Babylon.js Engine that is attached to the viewer.

Returns Engine
- Defined in src/api/classes/viewer.ts:211

gltfExportManager

get gltfExportManager(): GltfExportManager
Gets the GltfExportManager attached to the viewer.

Throws
Error if the GltfExportManager has not been initialized.

Returns GltfExportManager
- Defined in src/api/classes/viewer.ts:201

nodeNamingStrategyHandler

get nodeNamingStrategyHandler(): NodeNamingStrategyHandler
Gets the strategy handler for naming cloned nodes.

Returns NodeNamingStrategyHandler
- Defined in src/api/classes/viewer.ts:256
set nodeNamingStrategyHandler(value: NodeNamingStrategyHandler): void
Sets the strategy handler for naming cloned nodes.
Check the docs of the tag managers renaming chapter for further details.
Parameters
- value: NodeNamingStrategyHandler
Returns void
- Defined in src/api/classes/viewer.ts:268

scene

get scene(): Scene
Gets the Babylon.js Scene that is attached to the instance.

Throws
Error if the scene has not been initialized.

Returns Scene
- Defined in src/api/classes/viewer.ts:177

sceneManager

get sceneManager(): SceneManager
Gets the SceneManager attached to the viewer.

Throws
Error if the SceneManager has not been initialized.

Returns SceneManager
- Defined in src/api/classes/viewer.ts:189

tagManager

get tagManager(): TagManager
Returns TagManager
- Defined in src/api/classes/viewer.ts:239

variantInstances

get variantInstances(): VariantInstanceManager
Gets the VariantInstanceManager attached to the viewer.

Throws
Error if the VariantInstanceManager has not been initialized.

Returns VariantInstanceManager
- Defined in src/api/classes/viewer.ts:220

Methods

addEventListener

addEventListener(event: string, fn: ListenerFn<any[]>): EventBroadcaster
Adds a listener function for the given event.
Parameters
- event: string
- fn: ListenerFn<any[]>
Returns EventBroadcaster
Inherited from EventBroadcaster.addEventListener
- Defined in src/api/classes/eventBroadcaster.ts:17

autofocusActiveCamera

autofocusActiveCamera(settings?: AutofocusSettings): Promise<void>
Focuses the camera to see every visible mesh in scene and tries to optimize wheel precision and panning
Parameters
- Optional settings: AutofocusSettings
Returns Promise<void>
- Defined in src/api/classes/viewer.ts:535

bootstrap

bootstrap(tagManagerParameterValues?: TagManagerParameterValue[]): Promise<Viewer>
Starts the application. This will
- load the given "index" JSON file
- setup the scene with the "scene" JSON file
- create an (optional) default setup with different variant settings
- sets up resizing by attaching a debounced version of resize
Throws
Error if any of the files is not found/valid

Emits
BOOTSTRAP_START

Emits
BOOTSTRAP_END
Parameters
- Optional tagManagerParameterValues: TagManagerParameterValue[]
Returns Promise<Viewer>
- Defined in src/api/classes/viewer.ts:287

broadcastEvent

broadcastEvent(event: string, ...args: any[]): EventBroadcaster
Broadcasts the given event with given arguments to all listeners and emitters.
Parameters
- event: string
- Rest ...args: any[]
Returns EventBroadcaster
Inherited from EventBroadcaster.broadcastEvent
- Defined in src/api/classes/eventBroadcaster.ts:33

calculateBoundingBox

calculateBoundingBox(excludeGeometry?: ExcludedGeometryList): Promise<Mesh>
Calculates the bounding box from all visible meshes on the scene.
Parameters
- Optional excludeGeometry: ExcludedGeometryList
Returns Promise<Mesh>
- Defined in src/api/classes/viewer.ts:495

destroy

destroy(): Viewer
Destroys
- all VariantInstances using destroyVariantInstances
- calling dispose on the Engine and Scene
Returns Viewer
- Defined in src/api/classes/viewer.ts:614

destroyVariantInstances

destroyVariantInstances(): Viewer
Destroys all registered VariantInstances that are registered

Returns Viewer
- Defined in src/api/classes/viewer.ts:383

enableDebugLayer

enableDebugLayer(options?: IInspectorOptions): Promise<boolean>
Enables the Babylon.js Inspector.
Due to the additional size of the inspector, this function is only available in "development" builds!

Returns
Signalizes if inspector could be loaded
Parameters
- Optional options: IInspectorOptions
Returns Promise<boolean>
- Defined in src/api/classes/viewer.ts:345

getMesh

getMesh(variantInstanceName: string, elementDottedPath: DottedPathArgument, meshDottedPath: DottedPathArgument): Promise<null | Mesh>
A convenience method for directly getting a Node from a VariantInstance and an Element by its DottedPaths.
Parameters
- variantInstanceName: string
- elementDottedPath: DottedPathArgument
- meshDottedPath: DottedPathArgument
Returns Promise<null | Mesh>
- Defined in src/api/classes/viewer.ts:415

getNode

getNode(variantInstanceName: string, elementDottedPath: DottedPathArgument, nodeDottedPath: DottedPathArgument): Promise<TransformNode>
A convenience method for directly getting a Node from a VariantInstance and an Element by its DottedPaths.
Parameters
- variantInstanceName: string
- elementDottedPath: DottedPathArgument
- nodeDottedPath: DottedPathArgument
Returns Promise<TransformNode>
- Defined in src/api/classes/viewer.ts:402

isBrowserARCapable

isBrowserARCapable(): Promise<boolean>
Checks whether the browser is capable of handling XR.

Returns Promise<boolean>
- Defined in src/api/classes/viewer.ts:488

moveActiveCameraTo

moveActiveCameraTo(placement: string | PlacementDefinition, animation?: string | AnimationDefinition): Promise<AnimationInterface>
Moves or animates the active camera to given placement.
Parameters
- placement: string | PlacementDefinition
- Optional animation: string | AnimationDefinition
Returns Promise<AnimationInterface>
- Defined in src/api/classes/viewer.ts:452

off

off(event: string): EventBroadcaster
Alias for removeEventListener.
Parameters
- event: string
Returns EventBroadcaster
Inherited from EventBroadcaster.off
- Defined in src/api/classes/eventBroadcaster.ts:49

on

on(event: string, fn: ListenerFn<any[]>): EventBroadcaster
Alias for addEventListener.
Parameters
- event: string
- fn: ListenerFn<any[]>
Returns EventBroadcaster
Inherited from EventBroadcaster.on
- Defined in src/api/classes/eventBroadcaster.ts:42

pauseRendering

pauseRendering(): void
Pause render loop.

Returns void
- Defined in src/api/classes/viewer.ts:688

removeEventListener

removeEventListener(event: string): EventBroadcaster
Removes all eventListeners for given event.
Parameters
- event: string
Returns EventBroadcaster
Inherited from EventBroadcaster.removeEventListener
- Defined in src/api/classes/eventBroadcaster.ts:25

reset

reset(tagManagerParameterValues?: TagManagerParameterValue[]): Promise<Viewer>
Resets everything by calling destroy to clear all references and bootstrap to setup a clean environment
Parameters
- Optional tagManagerParameterValues: TagManagerParameterValue[]
Returns Promise<Viewer>
- Defined in src/api/classes/viewer.ts:603

resize

resize(): Viewer
Trigger a resize event for the Engine

Returns Viewer
- Defined in src/api/classes/viewer.ts:393

resumeRendering

resumeRendering(): void
Resume render loop when paused.

Returns void
- Defined in src/api/classes/viewer.ts:695

screenshot

screenshot(settings?: ScreenshotSettings): Promise<string>
Takes a sceenshot the the current scene. The result is a string containing a base64 encoded image
Parameters
- Optional settings: ScreenshotSettings
Returns Promise<string>
- Defined in src/api/classes/viewer.ts:462

showWorldCoordinates

showWorldCoordinates(dimension: number): void
Show coordinate system with given dimension (for debugging purpose).
Parameters
- dimension: number
Returns void
- Defined in src/api/classes/viewer.ts:624

switchCamera

switchCamera(newCamera: string, reset?: boolean): Viewer
Switches the camera

Emits
CAMERA_SWITCHED
Parameters
- newCamera: string
- reset: boolean = true
Returns Viewer
- Defined in src/api/classes/viewer.ts:429

`Static` generateSpec

generateSpec(genData: SpecGenerationData[]): AutoSpecStructureJson
Help function for automatically creating a valid Spec from a list of variant names and dedicated GLB/babylon URLs. This data is most likely coming from babylon assets from the Combeenation system but other sources are also valid.
Parameters
- genData: SpecGenerationData[]
Returns AutoSpecStructureJson
- Defined in src/api/classes/viewer.ts:85

`Static` getAllViewerModules

getAllViewerModules(): __module
Returns all modules which are exported by the viewers index file.

Needed by the Combeenation viewer control in situations where the viewer is injected from external code.

See Combeenation docs for more details.

Returns __module
- Defined in src/api/classes/viewer.ts:140

Class Viewer

Hierarchy

Index

Constructors

Properties

Accessors

Methods

Constructors

constructor

Parameters

canvas: HTMLCanvasElement

structureJson: string | StructureJson

Returns Viewer

Properties

Readonly canvas

Readonly eventEmitter

Static Readonly BOUNDING_BOX_NAME

Static version

Accessors

animationManager

Throws

Returns AnimationManager

cloneMaterialsOnMutation

Returns boolean

engine

Returns Engine

gltfExportManager

Throws

Returns GltfExportManager

nodeNamingStrategyHandler

Returns NodeNamingStrategyHandler

Parameters

value: NodeNamingStrategyHandler

Returns void

scene

Throws

Returns Scene

sceneManager

Throws

Returns SceneManager

tagManager

Returns TagManager

variantInstances

Throws

Returns VariantInstanceManager

Methods

addEventListener

Parameters

event: string

fn: ListenerFn<any[]>

Returns EventBroadcaster

autofocusActiveCamera

Parameters

Optional settings: AutofocusSettings

Returns Promise<void>

bootstrap

Throws

Emits

Emits

Parameters

Optional tagManagerParameterValues: TagManagerParameterValue[]

Returns Promise<Viewer>

broadcastEvent

Parameters

event: string

Rest ...args: any[]

Returns EventBroadcaster

calculateBoundingBox

Parameters

Optional excludeGeometry: ExcludedGeometryList

Returns Promise<Mesh>

destroy

Returns Viewer

destroyVariantInstances

Returns Viewer

enableDebugLayer

Returns

Parameters

Optional options: IInspectorOptions

Returns Promise<boolean>

`Readonly` canvas

`Readonly` eventEmitter

`Static` `Readonly` BOUNDING_BOX_NAME

`Static` version

`Optional` settings: AutofocusSettings

`Optional` tagManagerParameterValues: TagManagerParameterValue[]

`Rest` ...args: any[]

`Optional` excludeGeometry: ExcludedGeometryList

`Optional` options: IInspectorOptions

`Optional` animation: string | AnimationDefinition

`Optional` tagManagerParameterValues: TagManagerParameterValue[]

`Optional` settings: ScreenshotSettings

`Static` generateSpec

`Static` getAllViewerModules