# Viewer

class `cee.``Viewer`()

  The Viewer manages the `Views` it contains and handles user interaction (navigation and picking).

  You can add a new view with the `addView` function. The Viewer owns and manages the View, and you delete the view by using the `deleteViewAt` function.

  A Viewer can have multiple views. A single model can be shared in each view, or multiple different models can be added to specific views. By default, the views are positioned automatically, but you can set the position and size of each view manually using the `ViewLayoutMode` accessor.

  The Viewer handles the interaction with the user, both navigation (pan/rotate/zoom/walk) and selection/picking.

  You can trigger a redraw of the 3D view(s) with the `requestRedraw` function.

  Examples of the different highlight modes (See `ViewerOptions.highlightMode` )

Accessors

- `disableContextMenu`
- `pixelScaleFactor`
- `viewCount`
- `viewLayoutMode`

Methods

- `addView`
- `deleteAllViews`
- `deleteViewAt`
- `enableMouseButtonTracking`
- `enableNavigationHandling`
- `flyCameraTo`
- `getViewArray`
- `getViewAt`
- `getViewFromCssCoordinate`
- `oglWinPosFromClientCoord`
- `oglWinPosFromCssCoordinate`
- `rayFromCssCoordinate`
- `requestRedraw`
- `resizeViewer`
- `rubberBandZoom`
- `setActiveMouseNavigationsChangedHandler`
- `setCameraAnimation`
- `setColorLegendClickHandler`
- `setPickHandler`
- `setPixelScaleFactor`
- `setShowDebugWindow`
- `updatePixelScaleFactor`

## Accessors

`Viewer.``disableContextMenu`()

  Disable the context menu on right click

  Return type: | boolean

`Viewer.``disableContextMenu`(disable)

  Arguments: | disable (`boolean`) – None
  Return type: | void

`Viewer.``pixelScaleFactor`()

  The current pixel scale factor ( > 1 for ‘retina’/’high-dpi’) screen.

  Return type: | number

`Viewer.``viewCount`()

  The number of views in the Viewer

  Return type: | number

`Viewer.``viewLayoutMode`()

  The view layout mode for the viewer

  Return type: | ViewLayoutMode

`Viewer.``viewLayoutMode`(layoutMode)

  Arguments: | layoutMode (`ViewLayoutMode`) – None
  Return type: | void

## Methods

### addView

`Viewer.``addView`()

  Adds a view to the viewer.

  This functions creates a view, adds it to the viewer and returns the newly created view.

  You need at least one view in a viewer in order to display a model.

  Return type: | View

### deleteAllViews

`Viewer.``deleteAllViews`()

  Deletes all views from the viewer.

  Return type: | void

### deleteViewAt

`Viewer.``deleteViewAt`(viewIndex)

  Arguments: | viewIndex (`number`) – None

  Deletes the view at the given index.

  The index must be zero-based and between 0 and viewCount - 1

  Return type: | void

### enableMouseButtonTracking

`Viewer.``enableMouseButtonTracking`(enable)

  Arguments: | enable (`boolean`) – None
  Deprecated: |
  Return type: | void

### enableNavigationHandling

`Viewer.``enableNavigationHandling`(enable)

  Arguments: | enable (`boolean`) – None
  Deprecated: |
  Return type: | void

### flyCameraTo

`Viewer.``flyCameraTo`(cameraPos, viewDir, upVec, fieldOfViewYDegOrFrontPlaneFrustumHight, animDuration[, view])

  Arguments: | cameraPos (`Vec3Like`) – None viewDir (`Vec3Like`) – None upVec (`Vec3Like`) – None fieldOfViewYDegOrFrontPlaneFrustumHight (`number`) – None animDuration (`number`) – None view (`View`) – optional None

  Flies the camera from the current position to the specified new position in the given view.

  If the current projection in the active View camera is perspective, the fieldOfViewYDegOrFrontPlaneFrustumHight parameter is the final field of view in Y direction in degrees (as passed to Camera.setProjectionAsPerspective()).

  If the current projection is ortho, the fieldOfViewYDegOrFrontPlaneFrustumHight parameter is the final front plane frustum height (as passed to Camera.setProjectionAsOrtho()).

  If view is not specified then the operation is performed on the first view.

  Return type: | void

### getViewArray

`Viewer.``getViewArray`()

  Returns a read only array with all views in the viewer

  Return type: | unknown

### getViewAt

`Viewer.``getViewAt`(viewIndex)

  Arguments: | viewIndex (`number`) – None

  Returns the view at the given index.

  The index must be zero-based and between 0 and viewCount - 1

  Return type: | View

### getViewFromCssCoordinate

`Viewer.``getViewFromCssCoordinate`(offsetX, offsetY)

  Arguments: | offsetX (`number`) – The x coordinate in css pixel coordinates. This is relative to the top left corner of the Viewer’s Canvas element. offsetY (`number`) – The y coordinate in css pixel coordinates. This is relative to the top left corner of the Viewer’s Canvas element.

  Get the view containing the given Canvas/Viewer local CSS coordinate. This coordinate is relative to the top left corner of the canvas/viewer element in css pixels.

  The input coordinates can be set from MouseEvent.offsetX/offsetY.

  Returns: | The View containing the given coordinate, or null if no view contains the coordinate.
  Return type: | View

### oglWinPosFromClientCoord

`Viewer.``oglWinPosFromClientCoord`(clientX, clientY)

  Arguments: | clientX (`number`) – The X coordinate of the mouse pointer in local (DOM content) coordinates. clientY (`number`) – The Y coordinate of the mouse pointer in local (DOM content) coordinates.

  Convert from client (DOM content) coordinates to WebGL style coordinates

  Returns: | The WebGL style <x,y> coordinate for the given client coordinate in the viewer.
  Return type: | Vec2

### oglWinPosFromCssCoordinate

`Viewer.``oglWinPosFromCssCoordinate`(cssPixCoordX, cssPixCoordY)

  Arguments: | cssPixCoordX (`number`) – The x coordinate in css pixel coordinates. This is relative to the top left corner of the Viewer’s Canvas element. cssPixCoordY (`number`) – The y coordinate in css pixel coordinates. This is relative to the top left corner of the Viewer’s Canvas element.

  Convert from canvas local css (DOM content) coordinates to WebGL style coordinates, similar to offsetX/Y in in MouseEvent.

  The cssX/Y coordinates local Canvas coordinates in css (DOM content) coordinates. They are local to the Canvas element, so 0,0 is the top left corner of the Canvas element. The coordinates are in css pixels, so they are not affected by the device pixel ratio or any zoom in the browser. These coordinates are related to the MouseEvent.offsetX/Y coordinates.

  See https://developer.mozilla.org/en-US/docs/Web/CSS/CSSOM_View/Coordinate_systems for more on CSS coordinate systems. They correspond to the “Offset” system.

  Returns: | The WebGL style <x,y> coordinate for the given css coordinate in the viewer.
  Return type: | Vec2

### rayFromCssCoordinate

`Viewer.``rayFromCssCoordinate`(view, cssPixCoordX, cssPixCoordY)

  Arguments: | view (`View`) – None cssPixCoordX (`number`) – The x coordinate in css pixel coordinates. This is relative to the top left corner of the Viewer’s Canvas element. cssPixCoordY (`number`) – The y coordinate in css pixel coordinates. This is relative to the top left corner of the Viewer’s Canvas element.

  Get a ray from the given Canvas/Viewer local CSS coordinate. This coordinate is relative to the top left corner of the canvas/viewer element in css pixels.

  Returns: | A Ray than can be used for rayIntersect() on the various models. Returns null if a ray could not be created. The input coordinates can be set from MouseEvent.offsetX/offsetY.
  Return type: | Ray

### requestRedraw

`Viewer.``requestRedraw`()

  Notifies that this viewer needs a redraw. This will schedule a redraw on the next timer event.

  Use this method to force a redraw if you have changed something that does not update the viewer. This is not usually needed.

  Return type: | void

### resizeViewer

`Viewer.``resizeViewer`(canvasDisplayWidthCSSPixels, canvasDisplayHeightCSSPixels)

  Arguments: | canvasDisplayWidthCSSPixels (`number`) – None canvasDisplayHeightCSSPixels (`number`) – None

  Sets the display size of the viewer’s canvas in CSS pixels.

  Note that the input width and height is in CSS pixels which. This means that the resulting size of the canvas in physical pixels may end up being larger than the specified size depending on the currently set pixel scale factor (devicePixelRatio)

  Return type: | void

### rubberBandZoom

`Viewer.``rubberBandZoom`(view, clientX, clientY, width, height)

  Arguments: | view (`View`) – None clientX (`number`) – None clientY (`number`) – None width (`number`) – None height (`number`) – None

  Zooms in or out in the view by the given rubber band rectangle.

  clientX and clientY are the Top Left corner of the rectangle, specified in client coordinates (HTML window coordinates) (from e.g. a MouseEvent.clientX/Y)

  NOTE: This is the only method using client coordinates. All other relevant methods use Canvas/Viewer local CSS coordinates. This behavior will change in an upcoming major release.

  Return type: | void

### setActiveMouseNavigationsChangedHandler

`Viewer.``setActiveMouseNavigationsChangedHandler`(navigationHandler)

  Arguments: | navigationHandler (`MouseNavigationChangedHandler`) – None
  Deprecated: |
  Return type: | void

### setCameraAnimation

`Viewer.``setCameraAnimation`(cameraAnimation)

  Arguments: | cameraAnimation (`CameraAnimation`) – None

  Sets a camera animation that will be run for this viewer

  Return type: | void

### setColorLegendClickHandler

`Viewer.``setColorLegendClickHandler`(legendClickHandler)

  Arguments: | legendClickHandler (`ColorLegendClickedHandler`) – None

  Sets the handler function to be called whenever the user clicks on a color legend.

  The handler function will be passed the id of the scalar result.

  Return type: | void

### setPickHandler

`Viewer.``setPickHandler`(pickHandler)

  Arguments: | pickHandler (`PickHandler`) – None
  Deprecated: |
  Return type: | void

### setPixelScaleFactor

`Viewer.``setPixelScaleFactor`(pixelScaleFactor)

  Arguments: | pixelScaleFactor (`number`) – None

  Set pixel scale factor.

  Return type: | void

### setShowDebugWindow

`Viewer.``setShowDebugWindow`(show)

  Arguments: | show (`boolean`) – None

  Specifies if the debug overlay info window should be shown or not

  Return type: | void

Conversation saved
HOOPSY BETA

### Hello! I'm HOOPSY

Your Docs generative AI assistant. Ask me anything about HOOPS Envision for Web or choose a sample question below to start a conversation:

What is HOOPS Envision for Web?
What are the latest release notes for HOOPS Envision for Web?
How do I start evaluating HOOPS Envision for Web?
How do I write my first sample application?
How can I get assistance?

HOOPSY may store conversations according to OpenAI's policy. Responses may not always be accurate.

HOOPSY is thinking...