Reference Source
public class | source

Viewer

The 3D Viewer at the heart of the xeokit SDK.

Constructor Summary

Public Constructor
public

Member Summary

Public Members
public

The Viewer's Camera. This is also found on Scene#camera.

public

The Viewer's CameraControl, which controls the Scene's Camera with mouse, touch and keyboard input.

public

The Viewer's CameraFlightAnimation, which is used to fly the Scene's Camera to given targets.

public

The Viewer's ID.

public

The Viewer's current language setting.

public

Metadata about the Scene and the models and objects within it.

public

The Viewer's Scene.

Method Summary

Public Methods
public

Enter snapshot mode.

public

Destroys this Viewer.

public

Exists snapshot mode.

public

error(msg: String)

Logs an error message to the JavaScript developer console, prefixed with the ID of this Viewer.

public

fire(event: String, value: Object)

Fires an event at this Viewer.

public

getSnapshot(params: *): String

Gets a snapshot of this Viewer's Scene as a Base64-encoded image.

Usage:

const imageData = viewer.getSnapshot({
   width: 500,
   height: 500,
   format: "png"
});
public

log(msg: String)

Logs a message to the JavaScript developer console, prefixed with the ID of this Viewer.

public

off(event: *)

Unsubscribes from an event fired at this Viewer.

public

on(event: String, callback: Function)

Subscribes to an event fired at this Viewer.

Public Constructors

public constructor(cfg: Object) source

Params:

NameTypeAttributeDescription
cfg Object

Viewer configuration.

cfg.id String
  • optional

Optional ID for this Viewer, defaults to the ID of Viewer#scene, which xeokit automatically generates.

cfg.canvasId String
  • optional

ID of an existing HTML canvas for the Viewer#scene - either this or canvasElement is mandatory. When both values are given, the element reference is always preferred to the ID.

cfg.canvasElement HTMLCanvasElement
  • optional

Reference of an existing HTML canvas for the Viewer#scene - either this or canvasId is mandatory. When both values are given, the element reference is always preferred to the ID.

cfg.spinnerElementId String
  • optional

ID of existing HTML element to show the Spinner - internally creates a default element automatically if this is omitted.

cfg.passes Number
  • optional
  • default: 1

The number of times the Viewer#scene renders per frame.

cfg.clearEachPass Boolean
  • optional
  • default: false

When doing multiple passes per frame, specifies if to clear the canvas before each pass (true) or just before the first pass (false).

cfg.preserveDrawingBuffer Boolean
  • optional
  • default: true

Whether or not to preserve the WebGL drawing buffer. This needs to be true for Viewer#getSnapshot to work.

cfg.transparent Boolean
  • optional
  • default: true

Whether or not the canvas is transparent.

cfg.premultipliedAlpha Boolean
  • optional
  • default: false

Whether or not you want alpha composition with premultiplied alpha. Highlighting and selection works best when this is false.

cfg.gammaInput Boolean
  • optional
  • default: true

When true, expects that all textures and colors are premultiplied gamma.

cfg.gammaOutput Boolean
  • optional
  • default: true

Whether or not to render with pre-multiplied gama.

cfg.gammaFactor Number
  • optional
  • default: 2.2

The gamma factor to use when rendering with pre-multiplied gamma.

cfg.clearColorAmbient Boolean
  • optional
  • default: false

Sets if the canvas background color is derived from an AmbientLight. This only has effect when the canvas is not transparent. When not enabled, the background color will be the canvas element's HTML/CSS background color.

cfg.units String
  • optional
  • default: "meters"

The measurement unit type. Accepted values are "meters", "metres", , "centimeters", "centimetres", "millimeters", "millimetres", "yards", "feet" and "inches".

cfg.scale Number
  • optional
  • default: 1

The number of Real-space units in each World-space coordinate system unit.

cfg.origin Number[]
  • optional
  • default: [0,0,0]

The Real-space 3D origin, in current measurement units, at which the World-space coordinate origin [0,0,0] sits.

cfg.saoEnabled Boolean
  • optional
  • default: false

Whether to enable Scalable Ambient Obscurance (SAO) effect. See SAO for more info.

cfg.alphaDepthMask Boolean
  • optional
  • default: true

Whether writing into the depth buffer is enabled or disabled when rendering transparent objects.

Throw:

String

Throws an exception when both canvasId or canvasElement are missing or they aren't pointing to a valid HTMLCanvasElement.

Public Members

public camera: Camera source

The Viewer's Camera. This is also found on Scene#camera.

Properties:

NameTypeAttributeDescription
camera *

public cameraControl: CameraControl source

The Viewer's CameraControl, which controls the Scene's Camera with mouse, touch and keyboard input.

Properties:

NameTypeAttributeDescription
cameraControl *

public cameraFlight: CameraFlightAnimation source

The Viewer's CameraFlightAnimation, which is used to fly the Scene's Camera to given targets.

Properties:

NameTypeAttributeDescription
cameraFlight *

public id: String | Number source

The Viewer's ID.

Properties:

NameTypeAttributeDescription
id *

public language: String source

The Viewer's current language setting.

Properties:

NameTypeAttributeDescription
language *

public metaScene: MetaScene source

Metadata about the Scene and the models and objects within it.

Properties:

NameTypeAttributeDescription
metaScene *

public scene: Scene source

The Viewer's Scene.

Properties:

NameTypeAttributeDescription
scene *

Public Methods

public beginSnapshot() source

Enter snapshot mode.

Switches rendering to a hidden snapshot canvas.

Exit snapshot mode using Viewer#endSnapshot.

public destroy() source

Destroys this Viewer.

public endSnapshot() source

Exists snapshot mode.

Switches rendering back to the main canvas.

public error(msg: String) source

Logs an error message to the JavaScript developer console, prefixed with the ID of this Viewer.

Params:

NameTypeAttributeDescription
msg String

The error message

public fire(event: String, value: Object) source

Fires an event at this Viewer.

Params:

NameTypeAttributeDescription
event String

Event name

value Object

Event parameters

public getSnapshot(params: *): String source

Gets a snapshot of this Viewer's Scene as a Base64-encoded image.

Usage:

const imageData = viewer.getSnapshot({
   width: 500,
   height: 500,
   format: "png"
});

Params:

NameTypeAttributeDescription
params *
  • optional

Capture options.

params.width Number
  • optional

Desired width of result in pixels - defaults to width of canvas.

params.height Number
  • optional

Desired height of result in pixels - defaults to height of canvas.

params.format String
  • optional
  • default: "jpeg"

Desired format; "jpeg", "png" or "bmp".

Return:

String

String-encoded image data URI.

public log(msg: String) source

Logs a message to the JavaScript developer console, prefixed with the ID of this Viewer.

Params:

NameTypeAttributeDescription
msg String

The message

public off(event: *) source

Unsubscribes from an event fired at this Viewer.

Params:

NameTypeAttributeDescription
event *

public on(event: String, callback: Function) source

Subscribes to an event fired at this Viewer.

Params:

NameTypeAttributeDescription
event String

The event

callback Function

Callback fired on the event