@cognite/reveal 3.1.0 → 4.0.0-dev.20221025

package/{core → packages/api}/src/public/migration/Cognite3DViewer.d.ts

@@ -1,498 +1,534 @@
-/*!
- * Copyright 2021 Cognite AS
- */
-import * as THREE from 'three';
-import { PointerEventDelegate, SceneRenderedDelegate, DisposedDelegate } from '../../../../packages/utilities';
-import { Cognite3DModel } from '../../../../packages/cad-model';
-import { PointCloudBudget, CognitePointCloudModel } from '../../../../packages/pointclouds';
-import { AddModelOptions, Cognite3DViewerOptions, Intersection, CadModelBudget } from './types';
-import { IntersectionFromPixelOptions } from '../..';
-import { ViewerState } from '../../utilities/ViewStateHelper';
-import { CameraManager, CameraChangeDelegate } from '../../../../packages/camera-manager';
-import { SupportedModelTypes, CogniteModelBase } from '../../../../packages/model-base';
-/**
- * @example
- * ```js
- * const viewer = new Cognite3DViewer({
- *   noBackground: true,
- *   sdk: CogniteClient({...})
- * });
- * ```
- * @module @cognite/reveal
- */
-export declare class Cognite3DViewer {
-    private get canvas();
-    /**
-     * For now it just always returns true.
-     * @see Https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/getContext#Browser_compatibility.
-     */
-    static isBrowserSupported(): true;
-    /**
-     * The DOM element the viewer will insert its rendering canvas into.
-     * The DOM element can be specified in the options when the viewer is created.
-     * If not specified, the DOM element will be created automatically.
-     * The DOM element cannot be changed after the viewer has been created.
-     */
-    get domElement(): HTMLElement;
-    /**
-     * Returns the renderer used to produce images from 3D geometry.
-     */
-    get renderer(): THREE.WebGLRenderer;
-    private readonly _cdfSdkClient;
-    private readonly _dataSource;
-    private readonly camera;
-    private readonly _sceneHandler;
-    private readonly _cameraManager;
-    private readonly _subscription;
-    private readonly _revealManagerHelper;
-    private readonly _domElement;
-    private readonly _renderer;
-    private readonly _pickingHandler;
-    private readonly _boundAnimate;
-    private readonly _events;
-    private readonly _mouseHandler;
-    private readonly _models;
-    private readonly _extraObjects;
-    private isDisposed;
-    private readonly renderController;
-    private latestRequestId;
-    private readonly clock;
-    private _clippingNeedsUpdate;
-    private readonly spinner;
-    private get revealManager();
-    /**
-     * Reusable buffers used by functions in Cognite3dViewer to avoid allocations.
-     */
-    private readonly _updateNearAndFarPlaneBuffers;
-    /**
-     * Gets the current budget for downloading geometry for CAD models. Note that this
-     * budget is shared between all added CAD models and not a per-model budget.
-     */
-    get cadBudget(): CadModelBudget;
-    /**
-     * Sets the current budget for downloading geometry for CAD models. Note that this
-     * budget is shared between all added CAD models and not a per-model budget.
-     */
-    set cadBudget(budget: CadModelBudget);
-    /**
-     * Returns the point cloud budget. The budget is shared between all loaded
-     * point cloud models.
-     */
-    get pointCloudBudget(): PointCloudBudget;
-    /**
-     * Sets the point cloud budget. The budget is shared between all loaded
-     * point cloud models.
-     */
-    set pointCloudBudget(budget: PointCloudBudget);
-    /**
-     * Gets a list of models currently added to the viewer.
-     */
-    get models(): CogniteModelBase[];
-    constructor(options: Cognite3DViewerOptions);
-    /**
-     * Returns reveal version installed.
-     */
-    getVersion(): string;
-    /**
-     * Sets the log level. Used for debugging.
-     * Defaults to 'none' (which is identical to 'silent').
-     * @param level
-     */
-    setLogLevel(level: 'trace' | 'debug' | 'info' | 'warn' | 'error' | 'silent' | 'none'): void;
-    /**
-     * Dispose of WebGL resources. Can be used to free up memory when the viewer is no longer in use.
-     * @see {@link https://threejs.org/docs/#manual/en/introduction/How-to-dispose-of-objects}
-     * ```ts
-     * // Viewer is no longer in use, free up memory
-     * viewer.dispose();
-     * ```.
-     */
-    dispose(): void;
-    /**
-     * Triggered when the viewer is disposed. Listeners should clean up any
-     * resources held and remove the reference to the viewer.
-     */
-    on(event: 'disposed', callback: DisposedDelegate): void;
-    /**
-     * @example
-     * ```js
-     * const onClick = (event) => { console.log(event.offsetX, event.offsetY) };
-     * viewer.on('click', onClick);
-     * ```
-     */
-    on(event: 'click' | 'hover', callback: PointerEventDelegate): void;
-    /**
-     * @example
-     * ```js
-     * viewer.on('cameraChange', (position, target) => {
-     *   console.log('Camera changed: ', position, target);
-     * });
-     * ```
-     */
-    on(event: 'cameraChange', callback: CameraChangeDelegate): void;
-    /**
-     * Event that is triggered immediatly after the scene has been rendered.
-     * @param event Metadata about the rendering frame.
-     * @param callback Callback to trigger when the event occurs.
-     */
-    on(event: 'sceneRendered', callback: SceneRenderedDelegate): void;
-    /**
-     * @example
-     * ```js
-     * viewer.off('click', onClick);
-     * ```
-     */
-    off(event: 'click' | 'hover', callback: PointerEventDelegate): void;
-    /**
-     * @example
-     * ```js
-     * viewer.off('cameraChange', onCameraChange);
-     * ```
-     */
-    off(event: 'cameraChange', callback: CameraChangeDelegate): void;
-    /**
-     * @example
-     * ```js
-     * viewer.off('sceneRendered', updateStats);
-     * ```
-     */
-    off(event: 'sceneRendered', callback: SceneRenderedDelegate): void;
-    /**
-     * @example
-     * ```js
-     * viewer.off('disposed', clearAll);
-     * ```
-     */
-    off(event: 'disposed', callback: DisposedDelegate): void;
-    get cameraManager(): CameraManager;
-    /**
-     * Gets the current viewer state which includes the camera pose as well as applied styling.
-     * @returns JSON object containing viewer state.
-     */
-    getViewState(): ViewerState;
-    /**
-     * Restores camera settings from the state provided, and clears all current styled
-     * node collections and applies the `state` object.
-     * @param state Viewer state retrieved from {@link Cognite3DViewer.getViewState}.
-     */
-    setViewState(state: ViewerState): Promise<void>;
-    /**
-     * Add a new model to the viewer.
-     * Call {@link Cognite3DViewer.fitCameraToModel} to see the model after the model has loaded.
-     * @param options
-     * @example
-     * ```js
-     * const options = {
-     * modelId:     'COGNITE_3D_MODEL_ID',
-     * revisionId:  'COGNITE_3D_REVISION_ID',
-     * };
-     * viewer.addModel(options).then(model => {
-     * viewer.fitCameraToModel(model, 0);
-     * });
-     * ```
-     */
-    addModel(options: AddModelOptions): Promise<Cognite3DModel | CognitePointCloudModel>;
-    /**
-     * Add a new CAD 3D model to the viewer.
-     * Call {@link Cognite3DViewer.fitCameraToModel} to see the model after the model has loaded.
-     * @param options
-     * @example
-     * ```js
-     * const options = {
-     * modelId:     'COGNITE_3D_MODEL_ID',
-     * revisionId:  'COGNITE_3D_REVISION_ID',
-     * };
-     * viewer.addCadModel(options).then(model => {
-     * viewer.fitCameraToModel(model, 0);
-     * });
-     * ```
-     */
-    addCadModel(options: AddModelOptions): Promise<Cognite3DModel>;
-    /**
-     * Add a new pointcloud 3D model to the viewer.
-     * Call {@link Cognite3DViewer.fitCameraToModel} to see the model after the model has loaded.
-     * @param options
-     * @example
-     * ```js
-     * const options = {
-     * modelId:     'COGNITE_3D_MODEL_ID',
-     * revisionId:  'COGNITE_3D_REVISION_ID',
-     * };
-     * viewer.addPointCloudModel(options).then(model => {
-     * viewer.fitCameraToModel(model, 0);
-     * });
-     * ```
-     */
-    addPointCloudModel(options: AddModelOptions): Promise<CognitePointCloudModel>;
-    /**
-     * Removes a model that was previously added using {@link Cognite3DViewer.addModel},
-     * {@link Cognite3DViewer.addCadModel} or {@link Cognite3DViewer.addPointCloudModel}
-     * .
-     * @param model
-     */
-    removeModel(model: CogniteModelBase): void;
-    /**
-     * Use to determine of which type the model is.
-     *
-     * @param modelId The model's id.
-     * @param revisionId The model's revision id.
-     *
-     * @returns Empty string if type is not supported.
-     * @example
-     * ```typescript
-     * const viewer = new Cognite3DViewer(...);
-     * const type = await viewer.determineModelType(options.modelId, options.revisionId)
-     * let model: Cognite3DModel | CognitePointCloudModel
-     * switch (type) {
-     *   case 'cad':
-     *     model = await viewer.addCadModel(options);
-     *     break;
-     *   case 'pointcloud':
-     *     model = await viewer.addPointCloudModel(options);
-     *     break;
-     *   default:
-     *     throw new Error('Model is not supported');
-     * }
-     * viewer.fitCameraToModel(model);
-     * ```
-     */
-    determineModelType(modelId: number, revisionId: number): Promise<SupportedModelTypes | ''>;
-    /**
-     * Add a THREE.Object3D to the viewer.
-     * @param object
-     * @example
-     * ```js
-     * const sphere = new THREE.Mesh(
-     * new THREE.SphereBufferGeometry(),
-     * new THREE.MeshBasicMaterial()
-     * );
-     * viewer.addObject3D(sphere);
-     * ```
-     */
-    addObject3D(object: THREE.Object3D): void;
-    /**
-     * Remove a THREE.Object3D from the viewer.
-     * @param object
-     * @example
-     * ```js
-     * const sphere = new THREE.Mesh(new THREE.SphereBufferGeometry(), new THREE.MeshBasicMaterial());
-     * viewer.addObject3D(sphere);
-     * viewer.removeObject3D(sphere);
-     * ```
-     */
-    removeObject3D(object: THREE.Object3D): void;
-    /**
-     * Sets the color used as the clear color of the renderer.
-     * @param color
-     */
-    setBackgroundColor(color: THREE.Color): void;
-    /**
-     * Sets per-pixel clipping planes. Pixels behind any of the planes will be sliced away.
-     * @param clippingPlanes The planes to use for clipping.
-     * @example
-     * ```js
-     * // Hide pixels with values less than 0 in the x direction
-     * const plane = new THREE.Plane(new THREE.Vector3(1, 0, 0), 0);
-     * viewer.setClippingPlanes([plane]);
-     * ```
-     * ```js
-     * // Hide pixels with values greater than 20 in the x direction
-     *  const plane = new THREE.Plane(new THREE.Vector3(-1, 0, 0), 20);
-     * viewer.setClippingPlanes([plane]);
-     * ```
-     * ```js
-     * // Hide pixels with values less than 0 in the x direction or greater than 0 in the y direction
-     * const xPlane = new THREE.Plane(new THREE.Vector3(1, 0, 0), 0);
-     * const yPlane = new THREE.Plane(new THREE.Vector3(0, -1, 0), 0);
-     * viewer.setClippingPlanes([xPlane, yPlane]);
-     * ```
-     * ```js
-     * // Hide pixels behind an arbitrary, non axis-aligned plane
-     *  const plane = new THREE.Plane(new THREE.Vector3(1.5, 20, -19), 20);
-     * viewer.setClippingPlanes([plane]);
-     * ```
-     * ```js
-     * // Disable clipping planes
-     *  viewer.setClippingPlanes([]);
-     * ```
-     */
-    setClippingPlanes(clippingPlanes: THREE.Plane[]): void;
-    /**
-     * Returns the current active clipping planes.
-     */
-    getClippingPlanes(): THREE.Plane[];
-    /**
-     * @obvious
-     * @returns The THREE.Camera used for rendering.
-     */
-    getCamera(): THREE.PerspectiveCamera;
-    /**
-     * @obvious
-     * @returns The THREE.Scene used for rendering.
-     */
-    getScene(): THREE.Scene;
-    /**
-     * Attempts to load the camera settings from the settings stored for the
-     * provided model. See {@link https://docs.cognite.com/api/v1/#operation/get3DRevision}
-     * and {@link https://docs.cognite.com/api/v1/#operation/update3DRevisions} for
-     * information on how this setting is retrieved and stored. This setting can
-     * also be changed through the 3D models management interface in Cognite Fusion.
-     * If no camera configuration is stored in CDF, {@link Cognite3DViewer.fitCameraToModel}
-     * is used as a fallback.
-     * @param model The model to load camera settings from.
-     */
-    loadCameraFromModel(model: CogniteModelBase): void;
-    /**
-     * Move camera to a place where the 3D model is visible.
-     * It uses the bounding box of the 3D model and calls {@link Cognite3DViewer.fitCameraToBoundingBox}.
-     * @param model The 3D model.
-     * @param duration The duration of the animation moving the camera. Set this to 0 (zero) to disable animation.
-     * @example
-     * ```js
-     * // Fit camera to model
-     * viewer.fitCameraToModel(model);
-     * ```
-     * ```js
-     * // Fit camera to model over 500 milliseconds
-     * viewer.fitCameraToModel(model, 500);
-     * ```
-     * ```js
-     * // Fit camera to model instantly
-     * viewer.fitCameraToModel(model, 0);
-     * ```
-     */
-    fitCameraToModel(model: CogniteModelBase, duration?: number): void;
-    /**
-     * Move camera to a place where the content of a bounding box is visible to the camera.
-     * @param box The bounding box in world space.
-     * @param duration The duration of the animation moving the camera. Set this to 0 (zero) to disable animation.
-     * @param radiusFactor The ratio of the distance from camera to center of box and radius of the box.
-     * @example
-     * ```js
-     * // Fit camera to bounding box over 500 milliseconds
-     * viewer.fitCameraToBoundingBox(boundingBox, 500);
-     * ```
-     * ```js
-     * // Fit camera to bounding box instantaneously
-     * viewer.fitCameraToBoundingBox(boundingBox, 0);
-     * ```
-     * ```js
-     * // Place the camera closer to the bounding box
-     * viewer.fitCameraToBoundingBox(boundingBox, 500, 2);
-     * ```
-     */
-    fitCameraToBoundingBox(box: THREE.Box3, duration?: number, radiusFactor?: number): void;
-    /**
-     * Typically used when you perform some changes and can't see them unless you move camera.
-     */
-    requestRedraw(): void;
-    /**
-     * Convert a point in world space to its coordinates in the canvas. This can be used to place HTML objects near 3D objects on top of the 3D viewer.
-     * @see {@link https://www.w3schools.com/graphics/canvas_coordinates.asp https://www.w3schools.com/graphics/canvas_coordinates.asp}.
-     * @param point World space coordinate.
-     * @param normalize Optional. If true, coordinates are normalized into [0,1]. If false, the values are in the range [0, <canvas_size>).
-     * @returns Returns 2D coordinates if the point is visible on screen, or `null` if object is outside screen.
-     * @example
-     * ```js
-     * const boundingBoxCenter = new THREE.Vector3();
-     * // Find center of bounding box in world space
-     * model.getBoundingBox(nodeId).getCenter(boundingBoxCenter);
-     * // Screen coordinates of that point
-     * const screenCoordinates = viewer.worldToScreen(boundingBoxCenter);
-     * ```
-     * ```js
-     * const boundingBoxCenter = new THREE.Vector3();
-     * // Find center of bounding box in world space
-     * model.getBoundingBox(nodeId).getCenter(boundingBoxCenter);
-     * // Screen coordinates of that point normalized in the range [0,1]
-     * const screenCoordinates = viewer.worldToScreen(boundingBoxCenter, true);
-     * ```
-     * ```js
-     * const boundingBoxCenter = new THREE.Vector3();
-     * // Find center of bounding box in world space
-     * model.getBoundingBox(nodeId).getCenter(boundingBoxCenter);
-     * // Screen coordinates of that point
-     * const screenCoordinates = viewer.worldToScreen(boundingBoxCenter);
-     * if (screenCoordinates == null) {
-     *   // Object not visible on screen
-     * } else {
-     *   // Object is visible on screen
-     * }
-     * ```
-     */
-    worldToScreen(point: THREE.Vector3, normalize?: boolean): THREE.Vector2 | null;
-    /**
-     * Take screenshot from the current camera position.
-     * @param width Width of the final image. Default is current canvas size.
-     * @param height Height of the final image. Default is current canvas size.
-     * @returns A {@link https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs Data URL} of the image ('image/png').
-     * @example
-     * ```js
-     * // Take a screenshot with custom resolution
-     * const url = await viewer.getScreenshot(1920, 1080);
-     * ```
-     * ```js
-     * // Add a screenshot with resolution of the canvas to the page
-     * const url = await viewer.getScreenshot();
-     * const image = document.createElement('img');
-     * image.src = url;
-     * document.body.appendChild(url);
-     * ```
-     */
-    getScreenshot(width?: number, height?: number): Promise<string>;
-    /**
-     * Raycasting model(s) for finding where the ray intersects with the model.
-     * @param offsetX X coordinate in pixels (relative to the domElement).
-     * @param offsetY Y coordinate in pixels (relative to the domElement).
-     * @param options Options to control the behavior of the intersection operation. Optional (new in 1.3.0).
-     * @returns A promise that if there was an intersection then return the intersection object - otherwise it
-     * returns `null` if there were no intersections.
-     * @see {@link https://en.wikipedia.org/wiki/Ray_casting}.
-     *
-     * @example For CAD model
-     * ```js
-     * const offsetX = 50 // pixels from the left
-     * const offsetY = 100 // pixels from the top
-     * const intersection = await viewer.getIntersectionFromPixel(offsetX, offsetY);
-     * if (intersection) // it was a hit
-     *   console.log(
-     *   'You hit model ', intersection.model,
-     *   ' at the node with tree index ', intersection.treeIndex,
-     *   ' at this exact point ', intersection.point
-     *   );
-     * ```
-     *
-     * @example For point cloud
-     * ```js
-     * const offsetX = 50 // pixels from the left
-     * const offsetY = 100 // pixels from the top
-     * const intersection = await viewer.getIntersectionFromPixel(offsetX, offsetY);
-     * if (intersection) // it was a hit
-     *   console.log(
-     *   'You hit model ', intersection.model,
-     *   ' at the point index ', intersection.pointIndex,
-     *   ' at this exact point ', intersection.point
-     *   );
-     * ```
-     */
-    getIntersectionFromPixel(offsetX: number, offsetY: number): Promise<null | Intersection>;
-    /**
-     * @deprecated Since 3.1 options argument have no effect.
-     * */
-    getIntersectionFromPixel(offsetX: number, offsetY: number, options: IntersectionFromPixelOptions): Promise<null | Intersection>;
-    /** @private */
-    private getModels;
-    /**
-     * Creates a helper for managing viewer state.
-     */
-    private createViewStateHelper;
-    /** @private */
-    private animate;
-    /** @private */
-    private modelIntersectionCallback;
-    /** @private */
-    private recalculateBoundingBox;
-    /** @private */
-    private resizeIfNecessary;
-    private readonly startPointerEventListeners;
-}
+/*!
+ * Copyright 2021 Cognite AS
+ */
+import * as THREE from 'three';
+import { PointerEventDelegate, SceneRenderedDelegate, DisposedDelegate, BeforeSceneRenderedDelegate } from '../../../../utilities';
+import { Cognite3DModel } from '../../../../cad-model';
+import { PointCloudBudget, CognitePointCloudModel } from '../../../../pointclouds';
+import { AddImage360Options, AddModelOptions, Cognite3DViewerOptions, Intersection, CadModelBudget } from './types';
+import { ViewerState } from '../../utilities/ViewStateHelper';
+import { CameraManager, CameraChangeDelegate } from '../../../../camera-manager';
+import { SupportedModelTypes, CogniteModelBase } from '../../../../model-base';
+import { Image360Entity } from '../../../../360-images';
+/**
+ * @example
+ * ```js
+ * const viewer = new Cognite3DViewer({
+ *   noBackground: true,
+ *   sdk: CogniteClient({...})
+ * });
+ * ```
+ * @module @cognite/reveal
+ */
+export declare class Cognite3DViewer {
+    private readonly _domElementResizeObserver;
+    private readonly _image360ApiHelper;
+    private get canvas();
+    /**
+     * The DOM element the viewer will insert its rendering canvas into.
+     * The DOM element can be specified in the options when the viewer is created.
+     * If not specified, the DOM element will be created automatically.
+     * The DOM element cannot be changed after the viewer has been created.
+     */
+    get domElement(): HTMLElement;
+    /**
+     * Returns the renderer used to produce images from 3D geometry.
+     */
+    get renderer(): THREE.WebGLRenderer;
+    private readonly _cdfSdkClient;
+    private readonly _dataSource;
+    private readonly _sceneHandler;
+    private readonly _activeCameraManager;
+    private readonly _subscription;
+    private readonly _revealManagerHelper;
+    private readonly _domElement;
+    private readonly _renderer;
+    private readonly _pickingHandler;
+    private readonly _pointCloudPickingHandler;
+    private readonly _boundAnimate;
+    private readonly _events;
+    private readonly _mouseHandler;
+    private readonly _models;
+    private readonly _extraObjects;
+    private isDisposed;
+    private latestRequestId;
+    private readonly clock;
+    private _clippingNeedsUpdate;
+    private readonly spinner;
+    private get revealManager();
+    /**
+     * Reusable buffers used by functions in Cognite3dViewer to avoid allocations.
+     */
+    private readonly _updateNearAndFarPlaneBuffers;
+    /**
+     * Gets the current budget for downloading geometry for CAD models. Note that this
+     * budget is shared between all added CAD models and not a per-model budget.
+     */
+    get cadBudget(): CadModelBudget;
+    /**
+     * Sets the current budget for downloading geometry for CAD models. Note that this
+     * budget is shared between all added CAD models and not a per-model budget.
+     */
+    set cadBudget(budget: CadModelBudget);
+    /**
+     * Returns the point cloud budget. The budget is shared between all loaded
+     * point cloud models.
+     */
+    get pointCloudBudget(): PointCloudBudget;
+    /**
+     * Sets the point cloud budget. The budget is shared between all loaded
+     * point cloud models.
+     */
+    set pointCloudBudget(budget: PointCloudBudget);
+    /**
+     * Gets a list of models currently added to the viewer.
+     */
+    get models(): CogniteModelBase[];
+    constructor(options: Cognite3DViewerOptions);
+    /**
+     * Returns reveal version installed.
+     */
+    getVersion(): string;
+    /**
+     * Sets the log level. Used for debugging.
+     * Defaults to 'none' (which is identical to 'silent').
+     * @param level
+     */
+    setLogLevel(level: 'trace' | 'debug' | 'info' | 'warn' | 'error' | 'silent' | 'none'): void;
+    /**
+     * Dispose of WebGL resources. Can be used to free up memory when the viewer is no longer in use.
+     * @see {@link https://threejs.org/docs/#manual/en/introduction/How-to-dispose-of-objects}
+     * ```ts
+     * // Viewer is no longer in use, free up memory
+     * viewer.dispose();
+     * ```.
+     */
+    dispose(): void;
+    /**
+     * Triggered when the viewer is disposed. Listeners should clean up any
+     * resources held and remove the reference to the viewer.
+     */
+    on(event: 'disposed', callback: DisposedDelegate): void;
+    /**
+     * @example
+     * ```js
+     * const onClick = (event) => { console.log(event.offsetX, event.offsetY) };
+     * viewer.on('click', onClick);
+     * ```
+     */
+    on(event: 'click' | 'hover', callback: PointerEventDelegate): void;
+    /**
+     * @example
+     * ```js
+     * viewer.on('cameraChange', (position, target) => {
+     *   console.log('Camera changed: ', position, target);
+     * });
+     * ```
+     */
+    on(event: 'cameraChange', callback: CameraChangeDelegate): void;
+    /**
+     * Event that is triggered immediately before the scene is rendered.
+     * @param event Metadata about the rendering frame.
+     * @param callback Callback to trigger when event occurs.
+     */
+    on(event: 'beforeSceneRendered', callback: BeforeSceneRenderedDelegate): void;
+    /**
+     * Event that is triggered immediately after the scene has been rendered.
+     * @param event Metadata about the rendering frame.
+     * @param callback Callback to trigger when the event occurs.
+     */
+    on(event: 'sceneRendered', callback: SceneRenderedDelegate): void;
+    /**
+     * @example
+     * ```js
+     * viewer.off('click', onClick);
+     * ```
+     */
+    off(event: 'click' | 'hover', callback: PointerEventDelegate): void;
+    /**
+     * @example
+     * ```js
+     * viewer.off('cameraChange', onCameraChange);
+     * ```
+     */
+    off(event: 'cameraChange', callback: CameraChangeDelegate): void;
+    /**
+     * Unsubscribe the 'beforeSceneRendered'-event previously subscribed with {@link on}.
+     */
+    off(event: 'beforeSceneRendered', callback: BeforeSceneRenderedDelegate): void;
+    /**
+     * @example
+     * ```js
+     * viewer.off('sceneRendered', updateStats);
+     * ```
+     */
+    off(event: 'sceneRendered', callback: SceneRenderedDelegate): void;
+    /**
+     * @example
+     * ```js
+     * viewer.off('disposed', clearAll);
+     * ```
+     */
+    off(event: 'disposed', callback: DisposedDelegate): void;
+    get cameraManager(): CameraManager;
+    /**
+     * Sets the active camera manager instance for current Cognite3Dviewer.
+     * @param cameraManager Camera manager instance.
+     * @param preserveCameraState Whether to set current camera state to new camera manager.
+     */
+    setCameraManager(cameraManager: CameraManager, preserveCameraState?: boolean): void;
+    /**
+     * Gets the current viewer state which includes the camera pose as well as applied styling.
+     * @returns JSON object containing viewer state.
+     */
+    getViewState(): ViewerState;
+    /**
+     * Restores camera settings from the state provided, and clears all current styled
+     * node collections and applies the `state` object.
+     * @param state Viewer state retrieved from {@link Cognite3DViewer.getViewState}.
+     */
+    setViewState(state: ViewerState): Promise<void>;
+    /**
+     * Add a new model to the viewer.
+     * Call {@link Cognite3DViewer.fitCameraToModel} to see the model after the model has loaded.
+     * @param options
+     * @example
+     * ```js
+     * const options = {
+     * modelId:     'COGNITE_3D_MODEL_ID',
+     * revisionId:  'COGNITE_3D_REVISION_ID',
+     * };
+     * viewer.addModel(options).then(model => {
+     * viewer.fitCameraToModel(model, 0);
+     * });
+     * ```
+     */
+    addModel(options: AddModelOptions): Promise<Cognite3DModel | CognitePointCloudModel>;
+    /**
+     * Add a new CAD 3D model to the viewer.
+     * Call {@link Cognite3DViewer.fitCameraToModel} to see the model after the model has loaded.
+     * @param options
+     * @example
+     * ```js
+     * const options = {
+     * modelId:     'COGNITE_3D_MODEL_ID',
+     * revisionId:  'COGNITE_3D_REVISION_ID',
+     * };
+     * viewer.addCadModel(options).then(model => {
+     * viewer.fitCameraToModel(model, 0);
+     * });
+     * ```
+     */
+    addCadModel(options: AddModelOptions): Promise<Cognite3DModel>;
+    /**
+     * Add a new pointcloud 3D model to the viewer.
+     * Call {@link Cognite3DViewer.fitCameraToModel} to see the model after the model has loaded.
+     * @param options
+     * @example
+     * ```js
+     * const options = {
+     * modelId:     'COGNITE_3D_MODEL_ID',
+     * revisionId:  'COGNITE_3D_REVISION_ID',
+     * };
+     * viewer.addPointCloudModel(options).then(model => {
+     * viewer.fitCameraToModel(model, 0);
+     * });
+     * ```
+     */
+    addPointCloudModel(options: AddModelOptions): Promise<CognitePointCloudModel>;
+    /**
+     * Adds a set of 360 images to the scene from the /events API in Cognite Data Fusion.
+     * @param datasource The CDF data source which holds the references to the 360 image sets.
+     * @param eventFilter The metadata filter to apply when querying events that contains the 360 images.
+     * @param add360ImageOptions Options for behaviours when adding 360 images.
+     * @example
+     * ```js
+     * const eventFilter = { site_id: "12345" };
+     * await viewer.add360ImageSet(eventFilter);
+     * ```
+     */
+    add360ImageSet(datasource: 'events', eventFilter: {
+        [key: string]: string;
+    }, add360ImageOptions?: AddImage360Options): Promise<Image360Entity[]>;
+    /**
+     * Enter visualization of a 360 image.
+     * @param image360
+     */
+    enter360Image(image360: Image360Entity): Promise<void>;
+    /**
+     * Exit visualization of the 360 image.
+     */
+    exit360Image(): void;
+    /**
+     * Removes a model that was previously added using {@link Cognite3DViewer.addModel},
+     * {@link Cognite3DViewer.addCadModel} or {@link Cognite3DViewer.addPointCloudModel}
+     * .
+     * @param model
+     */
+    removeModel(model: CogniteModelBase): void;
+    /**
+     * Use to determine of which type the model is.
+     *
+     * @param modelId The model's id.
+     * @param revisionId The model's revision id.
+     *
+     * @returns Empty string if type is not supported.
+     * @example
+     * ```typescript
+     * const viewer = new Cognite3DViewer(...);
+     * const type = await viewer.determineModelType(options.modelId, options.revisionId)
+     * let model: Cognite3DModel | CognitePointCloudModel
+     * switch (type) {
+     *   case 'cad':
+     *     model = await viewer.addCadModel(options);
+     *     break;
+     *   case 'pointcloud':
+     *     model = await viewer.addPointCloudModel(options);
+     *     break;
+     *   default:
+     *     throw new Error('Model is not supported');
+     * }
+     * viewer.fitCameraToModel(model);
+     * ```
+     */
+    determineModelType(modelId: number, revisionId: number): Promise<SupportedModelTypes | ''>;
+    /**
+     * Add a THREE.Object3D to the viewer.
+     * @param object
+     * @example
+     * ```js
+     * const sphere = new THREE.Mesh(
+     * new THREE.SphereGeometry(),
+     * new THREE.MeshBasicMaterial()
+     * );
+     * viewer.addObject3D(sphere);
+     * ```
+     */
+    addObject3D(object: THREE.Object3D): void;
+    /**
+     * Remove a THREE.Object3D from the viewer.
+     * @param object
+     * @example
+     * ```js
+     * const sphere = new THREE.Mesh(new THREE.SphereGeometry(), new THREE.MeshBasicMaterial());
+     * viewer.addObject3D(sphere);
+     * viewer.removeObject3D(sphere);
+     * ```
+     */
+    removeObject3D(object: THREE.Object3D): void;
+    /**
+     * Sets the color used as the clear color of the renderer.
+     * @param color
+     */
+    setBackgroundColor(color: THREE.Color): void;
+    /**
+     * Sets per-pixel clipping planes. Pixels behind any of the planes will be sliced away.
+     * @param clippingPlanes The planes to use for clipping.
+     * @example
+     * ```js
+     * // Hide pixels with values less than 0 in the x direction
+     * const plane = new THREE.Plane(new THREE.Vector3(1, 0, 0), 0);
+     * viewer.setClippingPlanes([plane]);
+     * ```
+     * ```js
+     * // Hide pixels with values greater than 20 in the x direction
+     *  const plane = new THREE.Plane(new THREE.Vector3(-1, 0, 0), 20);
+     * viewer.setClippingPlanes([plane]);
+     * ```
+     * ```js
+     * // Hide pixels with values less than 0 in the x direction or greater than 0 in the y direction
+     * const xPlane = new THREE.Plane(new THREE.Vector3(1, 0, 0), 0);
+     * const yPlane = new THREE.Plane(new THREE.Vector3(0, -1, 0), 0);
+     * viewer.setClippingPlanes([xPlane, yPlane]);
+     * ```
+     * ```js
+     * // Hide pixels behind an arbitrary, non axis-aligned plane
+     *  const plane = new THREE.Plane(new THREE.Vector3(1.5, 20, -19), 20);
+     * viewer.setClippingPlanes([plane]);
+     * ```
+     * ```js
+     * // Disable clipping planes
+     *  viewer.setClippingPlanes([]);
+     * ```
+     */
+    setClippingPlanes(clippingPlanes: THREE.Plane[]): void;
+    /**
+     * Returns the current active clipping planes.
+     */
+    getClippingPlanes(): THREE.Plane[];
+    /**
+     * @obvious
+     * @returns The THREE.Camera used for rendering.
+     */
+    getCamera(): THREE.PerspectiveCamera;
+    /**
+     * @obvious
+     * @returns The THREE.Scene used for rendering.
+     */
+    getScene(): THREE.Scene;
+    /**
+     * Attempts to load the camera settings from the settings stored for the
+     * provided model. See {@link https://docs.cognite.com/api/v1/#operation/get3DRevision}
+     * and {@link https://docs.cognite.com/api/v1/#operation/update3DRevisions} for
+     * information on how this setting is retrieved and stored. This setting can
+     * also be changed through the 3D models management interface in Cognite Fusion.
+     * If no camera configuration is stored in CDF, {@link Cognite3DViewer.fitCameraToModel}
+     * is used as a fallback.
+     * @param model The model to load camera settings from.
+     */
+    loadCameraFromModel(model: CogniteModelBase): void;
+    /**
+     * Move camera to a place where the 3D model is visible.
+     * It uses the bounding box of the 3D model and calls {@link Cognite3DViewer.fitCameraToBoundingBox}.
+     * @param model The 3D model.
+     * @param duration The duration of the animation moving the camera. Set this to 0 (zero) to disable animation.
+     * @example
+     * ```js
+     * // Fit camera to model
+     * viewer.fitCameraToModel(model);
+     * ```
+     * ```js
+     * // Fit camera to model over 500 milliseconds
+     * viewer.fitCameraToModel(model, 500);
+     * ```
+     * ```js
+     * // Fit camera to model instantly
+     * viewer.fitCameraToModel(model, 0);
+     * ```
+     */
+    fitCameraToModel(model: CogniteModelBase, duration?: number): void;
+    /**
+     * Move camera to a place where the content of a bounding box is visible to the camera.
+     * @param box The bounding box in world space.
+     * @param duration The duration of the animation moving the camera. Set this to 0 (zero) to disable animation.
+     * @param radiusFactor The ratio of the distance from camera to center of box and radius of the box.
+     * @example
+     * ```js
+     * // Fit camera to bounding box over 500 milliseconds
+     * viewer.fitCameraToBoundingBox(boundingBox, 500);
+     * ```
+     * ```js
+     * // Fit camera to bounding box instantaneously
+     * viewer.fitCameraToBoundingBox(boundingBox, 0);
+     * ```
+     * ```js
+     * // Place the camera closer to the bounding box
+     * viewer.fitCameraToBoundingBox(boundingBox, 500, 2);
+     * ```
+     */
+    fitCameraToBoundingBox(box: THREE.Box3, duration?: number, radiusFactor?: number): void;
+    /**
+     * Typically used when you perform some changes and can't see them unless you move camera.
+     */
+    requestRedraw(): void;
+    /**
+     * Convert a point in world space to its coordinates in the canvas. This can be used to place HTML objects near 3D objects on top of the 3D viewer.
+     * @see {@link https://www.w3schools.com/graphics/canvas_coordinates.asp https://www.w3schools.com/graphics/canvas_coordinates.asp}.
+     * @param point World space coordinate.
+     * @param normalize Optional. If true, coordinates are normalized into [0,1]. If false, the values are in the range [0, <canvas_size>).
+     * @returns Returns 2D coordinates if the point is visible on screen, or `null` if object is outside screen.
+     * @example
+     * ```js
+     * const boundingBoxCenter = new THREE.Vector3();
+     * // Find center of bounding box in world space
+     * model.getBoundingBox(nodeId).getCenter(boundingBoxCenter);
+     * // Screen coordinates of that point
+     * const screenCoordinates = viewer.worldToScreen(boundingBoxCenter);
+     * ```
+     * ```js
+     * const boundingBoxCenter = new THREE.Vector3();
+     * // Find center of bounding box in world space
+     * model.getBoundingBox(nodeId).getCenter(boundingBoxCenter);
+     * // Screen coordinates of that point normalized in the range [0,1]
+     * const screenCoordinates = viewer.worldToScreen(boundingBoxCenter, true);
+     * ```
+     * ```js
+     * const boundingBoxCenter = new THREE.Vector3();
+     * // Find center of bounding box in world space
+     * model.getBoundingBox(nodeId).getCenter(boundingBoxCenter);
+     * // Screen coordinates of that point
+     * const screenCoordinates = viewer.worldToScreen(boundingBoxCenter);
+     * if (screenCoordinates == null) {
+     *   // Object not visible on screen
+     * } else {
+     *   // Object is visible on screen
+     * }
+     * ```
+     */
+    worldToScreen(point: THREE.Vector3, normalize?: boolean): THREE.Vector2 | null;
+    /**
+     * Take screenshot from the current camera position.
+     * @param width Width of the final image. Default is current canvas size.
+     * @param height Height of the final image. Default is current canvas size.
+     * @returns A {@link https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs Data URL} of the image ('image/png').
+     * @example
+     * ```js
+     * // Take a screenshot with custom resolution
+     * const url = await viewer.getScreenshot(1920, 1080);
+     * ```
+     * ```js
+     * // Add a screenshot with resolution of the canvas to the page
+     * const url = await viewer.getScreenshot();
+     * const image = document.createElement('img');
+     * image.src = url;
+     * document.body.appendChild(url);
+     * ```
+     */
+    getScreenshot(width?: number, height?: number): Promise<string>;
+    /**
+     * Raycasting model(s) for finding where the ray intersects with the model.
+     * @param offsetX X coordinate in pixels (relative to the domElement).
+     * @param offsetY Y coordinate in pixels (relative to the domElement).
+     * @returns A promise that if there was an intersection then return the intersection object - otherwise it
+     * returns `null` if there were no intersections.
+     * @see {@link https://en.wikipedia.org/wiki/Ray_casting}.
+     *
+     * @example For CAD model
+     * ```js
+     * const offsetX = 50 // pixels from the left
+     * const offsetY = 100 // pixels from the top
+     * const intersection = await viewer.getIntersectionFromPixel(offsetX, offsetY);
+     * if (intersection) // it was a hit
+     *   console.log(
+     *   'You hit model ', intersection.model,
+     *   ' at the node with tree index ', intersection.treeIndex,
+     *   ' at this exact point ', intersection.point
+     *   );
+     * ```
+     *
+     * @example For point cloud
+     * ```js
+     * const offsetX = 50 // pixels from the left
+     * const offsetY = 100 // pixels from the top
+     * const intersection = await viewer.getIntersectionFromPixel(offsetX, offsetY);
+     * if (intersection) // it was a hit
+     *   console.log(
+     *   'You hit model ', intersection.model,
+     *   ' at the point index ', intersection.pointIndex,
+     *   ' at this exact point ', intersection.point
+     *   );
+     * ```
+     */
+    getIntersectionFromPixel(offsetX: number, offsetY: number): Promise<null | Intersection>;
+    /** @private */
+    private getModels;
+    /**
+     * Creates a helper for managing viewer state.
+     */
+    private createViewStateHelper;
+    /** @private */
+    private animate;
+    /** @private */
+    private intersectModels;
+    /**
+     * Callback used by DefaultCameraManager to do model intersection. Made synchronous to avoid
+     * input lag when zooming in and out. Default implementation is async. See PR #2405 for more info.
+     * @private
+     */
+    private modelIntersectionCallback;
+    /** @private */
+    private recalculateBoundingBox;
+    /** @private */
+    private setupDomElementResizeListener;
+    private readonly startPointerEventListeners;
+}