Version: 3.x

Reacting to clicks in CAD models

Determining clicks is important in applications with an interactive 3D model. Cognite Reveal supports mappings clicks on the 2D rendered result to a 3D position and to determine what object is clicked. Cognite3DViewer.on('click', ...) is used to detect clicks in the 3D model, while Cognite3DViewer.getIntersectionFromPixel is used to determine clicked 3D world position and point from a mouse click.

Detecting clicked objects

The following example detects intersections at clicked positions and marks the intersected positions using a red sphere.

Live Editor

Highlighting clicked objects

It's quite common to highlight clicked objects. This can be achieved by using the node styling API.

Live Editor

In CAD models, it's quite common that equipment consists of many small geometry parts. Often it's desirable to highlight the entire equipment (e.g. a tank) and not just the individual pieces (e.g. a valve connected to the tank). This can be achieved by determining the ancestor tree indices of the clicked geometry. Cognite3DModel.getAncestorTreeIndices() can be used to determine this.

Live Editor