Class: Viewer

Viewer(display, options, notifyCallback, updateMarker)

new Viewer(display, options, notifyCallback, updateMarker)

Create Viewer.
Parameters:
Name Type Default Description
display Display The Display object.
options DisplayOptions configuration parameters.
notifyCallback NotificationCallback The callback to receive changes of viewer parameters.
updateMarker boolean true enforce to redraw orientation marker after evry ui activity
Source:

Members

getObjectColorCaps

Get whether the clipping caps color status
Source:

handleBackendResponse

Handle a backend response sent by the backend The response is a JSON object sent by the Python backend through VSCode
Source:

notifyStates

Notifies the states by checking for changes and passing the states to the checkChanges method.
Source:

pinAsPng

Replace CadView with an inline png image of the canvas. Note: Only the canvas will be shown, no tools and orientation marker
Source:

setBoundingBox

Sets the bounding box for a given ID.
Source:

setObject

Sets the visibility state of an object in the viewer.
Source:

syncTreeStates

Synchronizes the states of two tree structures recursively.
Source:

Methods

_decompose(shapes) → {Shapes}

Decompose a CAD object into faces, edges and vertices.
Parameters:
Name Type Description
shapes Shapes The Shapes object.
Source:
Returns:
A decomposed Shapes object.
Type
Shapes

_getTree(shapes) → {NavTree}

Retrieve the navigation tree from a Shapes object.
Parameters:
Name Type Description
shapes Shapes The Shapes object.
Source:
Returns:
The navigation tree object.
Type
NavTree

_renderTessellatedShapes(shapes) → {THREE.Group}

Render tessellated shapes of a CAD object.
Parameters:
Name Type Description
shapes Shapes The Shapes object representing the tessellated CAD object.
Source:
Returns:
A nested THREE.Group object.
Type
THREE.Group

addAnimationTrack(selector, action, time, values)

Add an animation track for a THREE.Group
Parameters:
Name Type Description
selector string path/id of group to be animated.
action string one of "rx", "ry", "rz" for rotations around axes, "q" for quaternions or "t", "tx", "ty", "tz" for translations.
time Array.<number> array of times.
values Array.<number> array of values, the type depends on the action.
Source:

animate()

Start the animation loop
Source:

backupAnimation()

Backup animation (for switch to explode animation)
Source:

checkChanges(changes, notify)

Creates ChangeNotification object if new value != old value and sends change notifications via viewer.notifyCallback.
Parameters:
Name Type Description
changes ChangeInfos change information.
notify boolean whether to send notification or not.
Source:

clear()

Clear CAD view and remove event handler.
Source:

clearAnimation()

Clear the animation obect and dispose dependent objects
Source:

controlAnimation(btn)

Handler for the animation control
Parameters:
Name Type Description
btn string the pressed button as string: "play", "pause", "stop"
Source:

dispose()

Remove assets and event handlers.
Source:

explode(durationopt, speedopt, multiplieropt)

Calculate explode trajectories and initiate the animation
Parameters:
Name Type Attributes Default Description
duration number <optional>
 2 duration of animation.
speed number <optional>
 1 speed of animation.
multiplier number <optional>
 2.5 multiplier for length of trajectories.
Source:

getAmbientLight() → {number}

Get intensity of ambient light.
Source:
Returns:
ambientLight value.
Type
number

getAxes() → {boolean}

Get whether axes helpers are shon/hidden.
Source:
Returns:
axes value.
Type
boolean

getAxes0() → {boolean}

Get location of axes.
Source:
Returns:
axes0 value, true means at origin (0,0,0)
Type
boolean

getBlackEdges() → {boolean}

Get blackEdges value.
Source:
Returns:
blackEdges value.
Type
boolean

getCameraPosition() → {Array.<number>}

Get the current camera position.
Source:
Returns:
camera position as 3 dim array [x,y,z].
Type
Array.<number>

getCameraQuaternion() → {Array.<number>}

Get the current camera rotation as quaternion.
Source:
Returns:
camera rotation as 4 dim quaternion array [x,y,z,w].
Type
Array.<number>

getCameraTarget() → {Array.<number>}

Get the current camera target.
Source:
Returns:
camera target as 3 dim array array [x,y,z].
Type
Array.<number>

getCameraType() → {string}

Get camera type.
Source:
Returns:
"ortho" or "perspective".
Type
string

getCameraZoom() → {number}

Get zoom value.
Source:
Returns:
zoom value.
Type
number

getClipIntersection() → {boolean}

Get intersection mode.
Source:
Returns:
clip intersection value.
Type
boolean

getClipNormal(index) → {boolean}

Get clipping plane state.
Parameters:
Name Type Description
index boolean index of the normal: 0, 1 ,2
Source:
Returns:
clip plane visibility value.
Type
boolean

getClipPlaneHelpers() → {boolean}

Get clipping plane state.
Source:
Returns:
clip plane visibility value.
Type
boolean

getClipSlider(index) → {boolean}

Get clipping slider value.
Parameters:
Name Type Description
index number index of the normal: 0, 1 ,2
Source:
Returns:
clip plane visibility value.
Type
boolean

getDirectLight() → {number}

Get intensity of direct light.
Source:
Returns:
directLight value.
Type
number

getEdgeColor() → {number}

Get default color of the edges.
Source:
Returns:
edgeColor value.
Type
number

getGrids() → {Array.<number>}

Get visibility of grids.
Source:
Returns:
grids value.
Type
Array.<number>

getImage(taksId)

Get the current canvas as png data.
Parameters:
Name Type Description
taksId string and id to identify the screenshot Note: Only the canvas will be shown, no tools and orientation marker
Source:

getOpacity() → {number}

Get default opacity.
Source:
Returns:
opacity value.
Type
number

getOrtho() → {number}

Get ortho value.
Source:
Returns:
ortho value.
Type
number

getPanSpeed() → {number}

Get panning speed.
Source:
Returns:
pan speed value.
Type
number

getResetLocation() → {object}

Get reset location value.
Source:
Returns:
- target, position, quaternion, zoom as object.
Type
object

getRotateSpeed() → {number}

Get rotation speed.
Source:
Returns:
rotation speed value.
Type
number

getState(path) → {Array.<number>}

Get state of a treeview leafs for a path. separator can be / or |
Parameters:
Name Type Description
path string path of the object
Source:
Returns:
state value in the form of [mesh, edges] = [0/1, 0/1]
Type
Array.<number>

getStates()

Get states of a treeview leafs.
Source:

getTools() → {boolean}

Get whether tools are shown/hidden.
Source:
Returns:
tools value.
Type
boolean

getTransparent() → {boolean}

Get transparency state of CAD objects.
Source:
Returns:
transparent value.
Type
boolean

getZoomSpeed() → {number}

Get zoom speed.
Source:
Returns:
zoomSpeed value.
Type
number

handlePick(shift)

Handle bounding box and notifications for picked elements
Parameters:
Name Type Description
string path of object
string name of object (id = path/name)
boolean meta key pressed
shift boolean whether to send notification or not.
Source:

hasAnimation()

Check whether animation object exists
Source:

initAnimation(duration, speed)

Initialize the animation.
Parameters:
Name Type Description
duration number overall duration of the anmiation.
speed number speed of the animation.
Source:

pick(e)

Find the shape that was double clicked and send notification
Parameters:
Name Type Description
e MouseEvent a DOM MouseEvent
Source:

presetCamera(dir, zoomopt, notifyopt)

Move the camera to one of the preset locations
Parameters:
Name Type Attributes Default Description
dir string can be "iso", "top", "bottom", "front", "rear", "left", "right"
zoom number <optional>
 null zoom value
notify boolean <optional>
 true whether to send notification or not.
Source:

recenterCamera(distance, notifyopt)

TODO: Doesn't work as expected. Needs to be fixed. Set camera mode to OrthographicCamera or PersepctiveCamera (see also setOrtho)
Parameters:
Name Type Attributes Default Description
distance number if provided, new camera distance
notify boolean <optional>
 true whether to send notification or not.
Source:

refreshPlane(index, value)

Refresh clipping plane
Parameters:
Name Type Description
index number index of the plane: 0,1,2
value number distance on the clipping normal from the center
Source:

render(shapes, viewerOptions, renderOptions)

Render a CAD object and build the navigation tree
Parameters:
Name Type Description
shapes Shapes the Shapes object representing the tessellated CAD object
viewerOptions ViewerOptions the viewer options
renderOptions RenderOptions the render options
Source:

renderTessellatedShapes(exploded, shapes) → {THREE.Group}

Render the shapes of the CAD object.
Parameters:
Name Type Description
exploded boolean Whether to render the compact or exploded version
shapes Shapes The Shapes object.
Source:
Returns:
A nested THREE.Group object.
Type
THREE.Group

reset()

Reset the view to the initial camera and controls settings
Source:

resize()

Reset zoom to 1.0
Source:

resizeCadView(cadWidth, treeWidth, height, glassopt)

Resize UI and renderer
Parameters:
Name Type Attributes Default Description
cadWidth number new width of CAD View
treeWidth number new width of navigation tree
height number new height of CAD View
glass boolean <optional>
 false Whether to use glass mode or not
Source:

restoreAnimation()

Restore animation (for switch back from explode animation)
Source:

setAmbientLight(val, notifyopt)

Set the intensity of ambient light
Parameters:
Name Type Attributes Default Description
val number the new ambient light intensity
notify boolean <optional>
 true whether to send notification or not.
Source:

setAxes(flag, notify)

Show/hide axes helper
Parameters:
Name Type Description
flag boolean whether to show the axes
notify boolean whether to send notification or not.
Source:

setAxes0(flag, notifyopt)

Set whether grids and axes center at the origin or the object's boundary box center
Parameters:
Name Type Attributes Default Description
flag boolean whether grids and axes center at the origin (0,0,0)
notify boolean <optional>
 true whether to send notification or not.
Source:

setBlackEdges(flag, notifyopt)

Show edges in black or the default edge color
Parameters:
Name Type Attributes Default Description
flag boolean whether to show edges in black
notify boolean <optional>
 true whether to send notification or not.
Source:

setCamera(relativeopt, position, quaternionopt, zoomopt, notifyopt)

Move the camera to a given locations
Parameters:
Name Type Attributes Default Description
relative relative <optional>
 false flag whether the position is a relative (e.g. [1,1,1] for iso) or absolute point.
position Array.<number> the camera position as 3 dim array [x,y,z]
quaternion Array.<number> <optional>
 null the camera rotation expressed by a quaternion array [x,y,z,w].
zoom number <optional>
 null zoom value.
notify boolean <optional>
 true whether to send notification or not.
Source:

setCameraPosition(position, relativeopt, notifyopt)

Set camera position.
Parameters:
Name Type Attributes Default Description
position Array.<number> camera position as 3 dim Array [x,y,z].
relative relative <optional>
 false flag whether the position is a relative (e.g. [1,1,1] for iso) or absolute point.
notify boolean <optional>
 true whether to send notification or not.
Source:

setCameraQuaternion(quaternion, notifyopt)

Set camera rotation via quaternion.
Parameters:
Name Type Attributes Default Description
quaternion Array.<number> camera rotation as 4 dim quaternion array [x,y,z,w].
notify boolean <optional>
 true whether to send notification or not.
Source:

setCameraTarget(target, notifyopt)

Set camera target.
Parameters:
Name Type Attributes Default Description
target Array.<number> camera target as 3 dim quaternion array [x,y,z].
notify boolean <optional>
 true whether to send notification or not.
Source:

setCameraZoom(val, notifyopt)

Set zoom value.
Parameters:
Name Type Attributes Default Description
val number float zoom value.
notify boolean <optional>
 true whether to send notification or not.
Source:

setClipIntersection(flag, notifyopt)

Set the clipping mode to intersection mode
Parameters:
Name Type Attributes Default Description
flag boolean whether to use intersection mode
notify boolean <optional>
 true whether to send notification or not.
Source:

setClipNormal(index, normal, notifyopt)

Set the normal at index to a given normal
Parameters:
Name Type Attributes Default Description
index number index of the normal: 0, 1 ,2
normal Array.<number> 3 dim array representing the normal
notify boolean <optional>
 true whether to send notification or not.
Source:

setClipNormalFromPosition(index, notifyopt)

Set the normal at index to the current viewing direction
Parameters:
Name Type Attributes Default Description
index number index of the normal: 0, 1 ,2
notify boolean <optional>
 true whether to send notification or not.
Source:

setClipObjectColorCaps(flag, notifyopt)

Toggle the clipping caps color between object color and RGB
Parameters:
Name Type Attributes Default Description
flag boolean whether to use intersection mode
notify boolean <optional>
 true whether to send notification or not.
Source:

setClipPlaneHelpers(flag, notifyopt)

Show/hide clip plane helpers
Parameters:
Name Type Attributes Default Description
flag boolean whether to show clip plane helpers
notify boolean <optional>
 true whether to send notification or not.
Source:

setClipPlaneHelpersCheck(flag)

Set clip plane helpers check box
Parameters:
Name Type Description
flag boolean whether to show clip plane helpers
Source:

setClipSlider(index, value, notifyopt)

Set clipping slider value.
Parameters:
Name Type Attributes Default Description
index number index of the normal: 0, 1 ,2
value number value for the clipping slide. will be trimmed to slide min/max limits
notify boolean <optional>
 true whether to send notification or not.
Source:

setDirectLight(val, notifyopt)

Set the intensity of directional light
Parameters:
Name Type Attributes Default Description
val number the new direct light intensity
notify boolean <optional>
 true whether to send notification or not.
Source:

setDisplayDefaults(options)

Enhance the given options for viewer creation by default values.
Parameters:
Name Type Description
options DisplayOptions The provided options object for the viewer.
Source:

setEdgeColor(edge, notifyopt)

Set the default edge color
Parameters:
Name Type Attributes Default Description
edge number color (0xrrggbb)
notify boolean <optional>
 true whether to send notification or not.
Source:

setGrid(action, notifyopt)

Show/hide grids
Parameters:
Name Type Attributes Default Description
action string one of "grid" (all grids), "grid-xy","grid-xz", "grid-yz"
notify boolean <optional>
 true whether to send notification or not.
Source:

setGridCenter(center, notifyopt)

Set grid center
Parameters:
Name Type Attributes Default Description
center Array.<boolean> true for centering grid at (0,0,0)
notify boolean <optional>
 true whether to send notification or not.
Source:

setGrids(grids, notifyopt)

Toggle grid visibility
Parameters:
Name Type Attributes Default Description
grids Array.<boolean> 3 dim grid visibility (xy, xz, yz)
notify boolean <optional>
 true whether to send notification or not.
Source:

setKeyMap(keymap)

Set modifiers for keymap
Parameters:
Name Type Description
keymap config e.g. {"shift": "shiftKey", "ctrl": "ctrlKey", "meta": "altKey"}
Source:

setLocalClipping(flag)

Enbable/disable local clipping
Parameters:
Name Type Description
flag boolean whether to enable local clipping
Source:

setOpacity(opacity, notifyopt)

Set the default opacity
Parameters:
Name Type Attributes Default Description
opacity number (between 0.0 and 1.0)
notify boolean <optional>
 true whether to send notification or not.
Source:

setOrtho(whether)

Set/unset camera's orthographic mode.
Parameters:
Name Type Description
whether boolean to set orthographic mode or not.
Source:

setPanSpeed(val, notify)

Set pan speed.
Parameters:
Name Type Description
val number the new pan speed
notify boolean whether to send notification or not.
Source:

setRaycastMode(flag)

Set raycast mode
Parameters:
Name Type Description
flag boolean turn raycast mode on or off
Source:

setRenderDefaults(options)

Enhance the given options for rendering by default values.
Parameters:
Name Type Description
options RenderOptions The provided options object for the viewer.
Source:

setResetLocation(target, position, quaternion, zoom, notifyopt)

Set reset location value.
Parameters:
Name Type Attributes Default Description
target Array.<number> camera target as 3 dim Array [x,y,z].
position Array.<number> camera position as 3 dim Array [x,y,z].
quaternion Array.<number> camera rotation as 4 dim quaternion array [x,y,z,w].
zoom number camera zoom value.
notify boolean <optional>
 true whether to send notification or not.
Source:

setRotateSpeed(val, notify)

Set rotation speed.
Parameters:
Name Type Description
val number the new rotation speed.
notify boolean whether to send notification or not.
Source:

setState(id, state)

Set state of one entry of a treeview leaf given by an id
Parameters:
Name Type Description
id string object id
state Array.<number> 2 dim array [mesh, edges] = [0/1, 0/1]
Source:

setStates()

Set states of a treeview leafs
Parameters:
Type Description
dict states
Source:

setTransparent(flag, notifyopt)

Set CAD objects transparency
Parameters:
Name Type Attributes Default Description
flag boolean whether to show the CAD object in transparent mode
notify boolean <optional>
 true whether to send notification or not.
Source:

setViewerDefaults(options)

Enhance the given options for the view by default values.
Parameters:
Name Type Description
options ViewOptions The provided options object for the viewer.
Source:

setZoomSpeed(val, notify)

Set zoom speed.
Parameters:
Name Type Description
val number the new zoom speed
notify boolean whether to send notification or not.
Source:

showTools(flag, notifyopt)

Show/hide the CAD tools
Parameters:
Name Type Attributes Default Description
flag boolean
notify boolean <optional>
 true whether to send notification or not.
Source:

switchCamera(flag, notifyopt)

Set camera mode to OrthographicCamera or PersepctiveCamera (see also setOrtho)
Parameters:
Name Type Attributes Default Description
flag boolean whether the camery should be orthographic or persepctive
notify boolean <optional>
 true whether to send notification or not.
Source:

toggleGroup(expanded)

Toggle the two version of the NestedGroup
Parameters:
Name Type Description
expanded whether to render the exploded or compact version
Source:

toggleTab(boolean)

Toggle tab and ensure collaps is treated correctly Needs to be called in sync with toggleGroup!
Parameters:
Name Type Description
boolean disable - true to disable clipping tab
Source:

trimUI(tags, flag)

Calculate explode trajectories and initiate the animation
Parameters:
Name Type Description
tags Array.<string> e.g. ["axes", "axes0", "grid", "ortho", "more", "help"]
flag boolean whether to turn on or off the UI elements.
Source:

update(updateMarker, fromAnimationLoop, notify)

Render scene and update orientation marker If no animation loop exists, this needs to be called manually after every camera/scene change
Parameters:
Name Type Description
updateMarker boolean whether to update the orientation marker
fromAnimationLoop boolean whether a animation loop is running in the background. Update will skipped for this case
notify boolean whether to send notification or not.
Source:

version()

Return three-cad-viewer version as semver string
Source:
Returns:
semver version