OpenLIME

Class: LensDashboardNavigator

LensDashboardNavigator

LensDashboardNavigator class creates an interactive lens dashboard with navigation controls. Provides:

  • Camera movement control
  • Light direction control
  • Annotation switching and navigation
  • Toolbar UI elements positioned around the lens

new LensDashboardNavigator(viewer [, options])

Creates a new LensDashboardNavigator instance.

Parameters:
Name Type Argument Description
viewer Viewer

The OpenLIME viewer instance
options Object <optional>

Configuration options

Properties
Name Type Argument Default Description
toolboxHeight number <optional>
 22

Height of the toolbox UI elements in pixels
toolboxGap number <optional>
 5

Gap (in px) between left and roght toolboxes
angleToolbar number <optional>
 30

Angle of toolbar position in degrees
actions Object <optional>

Configuration for toolbar actions

Properties
Name Type Argument Description
camera Object <optional>

Camera control action

Properties
Name Type Description
label string

Action identifier
task function

Callback for camera action
light Object <optional>

Light control action

Properties
Name Type Description
label string

Action identifier
task function

Callback for light action
annoswitch Object <optional>

Annotation toggle action

Properties
Name Type Description
label string

Action identifier
type string

Action type ('toggle')
toggleClass string

CSS class for toggle element
task function

Callback for annotation toggle
prev Object <optional>

Previous annotation action

Properties
Name Type Description
label string

Action identifier
task function

Callback for previous action
down Object <optional>

Download annotation action

Properties
Name Type Description
label string

Action identifier
task function

Callback for download action
next Object <optional>

Next annotation action

Properties
Name Type Description
label string

Action identifier
task function

Callback for next action
updateCb function <optional>

Callback fired during lens updates
updateEndCb function <optional>

Callback fired when lens movement ends
Source:

Extends

Methods

append(elm)

Adds an HTML element to the dashboard container. The element should use absolute positioning relative to the container. Example:

const button = document.createElement('button');
button.style = 'position: absolute; left: 10px; top: 10px;';
lensDashboard.append(button);
Parameters:
Name Type Description
elm HTMLElement

The HTML element to add
Inherited From:
Overrides:
Source:

removeMaskFromSvgLayer(svg)

Removes the lens mask from an SVG element. Returns the element to its normal, unmasked rendering.

Parameters:
Name Type Description
svg SVGElement

The SVG element to unmask
Inherited From:
Overrides:
Source:

setActionEnabled(label [, enable])

Enables or disables a specific action button.

Parameters:
Name Type Argument Default Description
label string

The action label to modify
enable boolean <optional>
 true

Whether to enable or disable the action
Source:

setBackgroundRenderingMode(mode)

Sets the rendering mode for the background (area outside the lens). Controls whether content outside the lens is shown or hidden.

Parameters:
Name Type Description
mode RenderingMode

The rendering mode to use
Inherited From:
Overrides:
Source:

setLayerSvgAnnotation(layer)

Associates a LayerSvgAnnotation with the dashboard. This enables proper masking of SVG annotations within the lens area.

Parameters:
Name Type Description
layer LayerSvgAnnotation

The SVG annotation layer to associate
Inherited From:
Overrides:
Source:

setLensRenderingMode(mode)

Sets the rendering mode for the lens area. Controls whether content inside the lens is shown or hidden.

Parameters:
Name Type Description
mode RenderingMode

The rendering mode to use
Inherited From:
Overrides:
Source:

setMaskOnSvgLayer(svg)

Applies the lens mask to an SVG element. Elements with the mask will only be visible within the lens area (or outside, depending on mask configuration).

Parameters:
Name Type Description
svg SVGElement

The SVG element to mask
Inherited From:
Overrides:
Source:

toggle()

Toggles the visibility of the dashboard UI elements. Uses CSS classes to show/hide the interface.

Inherited From:
Overrides:
Source: