Skip to main content
Version: 4.x

Overview

Reveal is a JavaScript library for visualizing big 3D models on the web. It supports complex CAD models and large point clouds. The library supports 3D model hosted by Cognite Data Fusion (CDF) which supports ingestion of a variety of 3D formats. If you do not have access you can use models provided through the Open Industrial Data project for testing.

If you have previously used the previous version of Reveal, @cognite/3d-viewer, and want to migrate to this package, please see the Migration guide. For details about the installation procedure and how to use Reveal in certain environments, see the Installation guide.

CAD models​

CAD (Computer-Aided Design) models are technical design 3D models. For the big asset industry these are typically very complex and can often consist of several million individual objects. To enable interactive visualization of such models Cognite Data Fusion (CDF) processes these models to optimize the geometry and the structure, enabling Reveal to visualize them on the web.

CAD models typically contain attributes/properties associated with each 3D object (also called node). These attributes can provide valuable metadata, such as extent, function, what system the object is part of and it's operation specifications. CDF and Reveal provide functionality for queries based on the attributes to perform filtering, styling and to collect information.

A grayscale CAD model

Point cloud models​

Point cloud models are 3D models generated from techniques such as 3D scanning or photogrammetry. Cognite Data Fusion (CDF) processes point clouds and stores them in a format suitable for visualization.

Point cloud model

Technology​

Behind the scenes Reveal based on WebGL through ThreeJS and uses three-loader for point cloud visualization. three-loader is based on Potree.

Reveal is written in TypeScript and uses WebAssembly modules written in Rust to do much of the heavy-lifting.

Reveal is available on Github. If you find issues, have a feature suggestion or a question, please register a ticket in our issue tracker.

A note on coordinate systems​

The models provided by CDF are stored in "CDF space", a coordinate system where the positive Z axis is the up direction. However, objects visualized in Reveal uses ThreeJS's coordinate system, which has the positive Y axis pointing upward. The transformation between these two coordinate systems is handled automatically behind the scenes for all CDF models. This difference can still introduce errors when combining models in Reveal with other data from CDF. To transform objects between the two coordinate systems, the @cognite/reveal package exports the transformation in the variable CDF_TO_VIEWER_TRANSFORMATION.

To transform e.g. a bounding box from CDF space to Viewer space, you may write

// import { CDF_TO_VIEWER_TRANSFORMATION } from '@cognite/reveal';
// import { Box3, Matrix4 } from 'three';

const viewerBoundingBox: Box3 = cdfBoundingBox.applyMatrix4(CDF_TO_VIEWER_TRANSFORMATION);

and conversely, to transform the other way:


const viewerToCdfTransformation: Matrix4 = CDF_TO_VIEWER_TRANSFORMATION.clone().invert();
const cdfBoundingBox: Box3 = viewerBoundingBox.applyMatrix4(viewerToCdfTransformation);