@inweb/viewer-three 26.1.2 → 26.1.4

package/lib/Viewer/Viewer.d.ts

@@ -1,4 +1,4 @@
-import { Box3, Object3D, OrthographicCamera, PerspectiveCamera, Scene, Vector3, WebGLRenderer } from "three";
+import { Box3, Object3D, PerspectiveCamera, Scene, Vector3, WebGLRenderer } from "three";
 import { GLTF } from "three/examples/jsm/loaders/GLTFLoader.js";
 import { EventEmitter2 } from "@inweb/eventemitter2";
 import { Assembly, Client, Model, File } from "@inweb/client";
@@ -15,7 +15,7 @@ export declare class Viewer extends EventEmitter2<ViewerEventMap & CanvasEventMa
     canvasEvents: string[];
     scene: Scene | undefined;
     helpers: Scene | undefined;
-    camera: PerspectiveCamera | OrthographicCamera | undefined;
+    camera: PerspectiveCamera | undefined;
     renderer: WebGLRenderer | undefined;
     models: Array<GLTF>;
     selected: Array<Object3D>;
@@ -27,9 +27,9 @@ export declare class Viewer extends EventEmitter2<ViewerEventMap & CanvasEventMa
     private renderTime;
     private _markup;
     /**
-     * @param client - The `Client` instance that is used to load model reference files from the Open Cloud
-     *   Server. Do not specify `Client` if you need a standalone viewer instance to view `glTF` files from
-     *   the web or from local computer.
+     * @param client - The `Client` instance that is used to load model reference files from the
+     *   Open Cloud Server. Do not specify `Client` if you need a standalone viewer instance to
+     *   view `glTF` files from the web or from local computer.
      */
     constructor(client?: Client);
     get options(): IOptions;
@@ -53,12 +53,12 @@ export declare class Viewer extends EventEmitter2<ViewerEventMap & CanvasEventMa
      *
      * The file geometry data on the server must be converted to `glTF` format.
      *
-     * This method requires a `Client` instance to be specified when creating the viewer to load model
-     * reference files from the Open Cloud Server. For a standalone viewer instance use
+     * This method requires a `Client` instance to be specified when creating the viewer to load
+     * model reference files from the Open Cloud Server. For a standalone viewer instance use
      * {@link openGltfFile | openGltfFile()}.
      *
-     * If there was an active dragger before opening the file, it will be deactivated. After opening the
-     * file, you must manually activate the required dragger.
+     * If there was an active dragger before opening the file, it will be deactivated. After
+     * opening the file, you must manually activate the required dragger.
      *
      * Fires:
      *
@@ -70,17 +70,17 @@ export declare class Viewer extends EventEmitter2<ViewerEventMap & CanvasEventMa
      * - {@link GeometryEndEvent | geometryend}
      * - {@link GeometryErrorEvent | geometryerror}
      *
-     * @param file - File, assembly or specific model to load. If a `File` instance with multiple models is
-     *   specified, the default model will be loaded. If there is no default model, first availiable model
-     *   will be loaded.
+     * @param file - File, assembly or specific model to load. If a `File` instance with multiple
+     *   models is specified, the default model will be loaded. If there is no default model,
+     *   first availiable model will be loaded.
      */
     open(file: Model | File | Assembly): Promise<this>;
     cancel(): this;
     /**
      * Loads a `glTF` file into the viewer.
      *
-     * If there was an active dragger before opening the file, it will be deactivated. After opening the
-     * file, you must manually activate the required dragger.
+     * If there was an active dragger before opening the file, it will be deactivated. After
+     * opening the file, you must manually activate the required dragger.
      *
      * Fires:
      *
@@ -92,22 +92,22 @@ export declare class Viewer extends EventEmitter2<ViewerEventMap & CanvasEventMa
      * - {@link GeometryErrorEvent | geometryerror}
      *
      * @param file - File URL or binary data buffer to load.
-     * @param externalData - External resource map such as binary data buffers or images. Each resource
-     *   should be represented by a `uri` and a corresponding resource URL, or
+     * @param externalData - External resource map such as binary data buffers or images. Each
+     *   resource should be represented by a `uri` and a corresponding resource URL, or
      *   {@link https://developer.mozilla.org/docs/Web/API/File | Web API File} object, or
      *   {@link https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer | ArrayBuffer}
      *   or {@link https://developer.mozilla.org/docs/Web/API/Blob/Blob | Blob}, or
      *   {@link https://developer.mozilla.org/docs/Web/HTTP/Basics_of_HTTP/Data_URIs | Data URL} string,
      * @param params - Loader parameters.
-     * @param params.path - The base path from which to find subsequent glTF resources such as textures and
-     *   .bin data files. If not defined, the base path of the file URL will be used.
+     * @param params.path - The base path from which to find subsequent glTF resources such as
+     *   textures and .bin data files. If not defined, the base path of the file URL will be used.
      * @param params.requestHeader - The
-     *   {@link https://developer.mozilla.org/docs/Glossary/Request_header | request header} used in HTTP
-     *   request.
-     * @param params.crossOrigin - The crossOrigin string to implement CORS for loading the url from a
-     *   different domain that allows CORS. Default is `anonymous`.
-     * @param params.withCredentials - Whether the XMLHttpRequest uses credentials such as cookies,
-     *   authorization headers or TLS client certificates. See
+     *   {@link https://developer.mozilla.org/docs/Glossary/Request_header | request header} used
+     *   in HTTP request.
+     * @param params.crossOrigin - The crossOrigin string to implement CORS for loading the url
+     *   from a different domain that allows CORS. Default is `anonymous`.
+     * @param params.withCredentials - Whether the XMLHttpRequest uses credentials such as
+     *   cookies, authorization headers or TLS client certificates. See
      *   {@link https://developer.mozilla.org/docs/Web/API/XMLHttpRequest/withCredentials | XMLHttpRequest.withCredentials}.
      */
     openGltfFile(file: string | globalThis.File | ArrayBuffer | Blob, externalData?: Map<string, string | globalThis.File | ArrayBuffer | Blob>, params?: {
@@ -129,22 +129,22 @@ export declare class Viewer extends EventEmitter2<ViewerEventMap & CanvasEventMa
      * - {@link GeometryErrorEvent | geometryerror}
      *
      * @param file - File URL or binary data buffer to load.
-     * @param externalData - External resource map such as binary data buffers or images. Each resource
-     *   should be represented by a `uri` and a corresponding resource URL, or
+     * @param externalData - External resource map such as binary data buffers or images. Each
+     *   resource should be represented by a `uri` and a corresponding resource URL, or
      *   {@link https://developer.mozilla.org/docs/Web/API/File | Web API File} object, or
      *   {@link https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer | ArrayBuffer}
      *   or {@link https://developer.mozilla.org/docs/Web/API/Blob/Blob | Blob}, or
      *   {@link https://developer.mozilla.org/docs/Web/HTTP/Basics_of_HTTP/Data_URIs | Data URL} string,
      * @param params - Loader parameters.
-     * @param params.path - The base path from which to find subsequent glTF resources such as textures and
-     *   .bin data files.
+     * @param params.path - The base path from which to find subsequent glTF resources such as
+     *   textures and .bin data files.
      * @param params.requestHeader - The
-     *   {@link https://developer.mozilla.org/docs/Glossary/Request_header | request header} used in HTTP
-     *   request.
-     * @param params.crossOrigin - The crossOrigin string to implement CORS for loading the url from a
-     *   different domain that allows CORS. Default is `anonymous`.
-     * @param params.withCredentials - Whether the XMLHttpRequest uses credentials such as cookies,
-     *   authorization headers or TLS client certificates. See
+     *   {@link https://developer.mozilla.org/docs/Glossary/Request_header | request header} used
+     *   in HTTP request.
+     * @param params.crossOrigin - The crossOrigin string to implement CORS for loading the url
+     *   from a different domain that allows CORS. Default is `anonymous`.
+     * @param params.withCredentials - Whether the XMLHttpRequest uses credentials such as
+     *   cookies, authorization headers or TLS client certificates. See
      *   {@link https://developer.mozilla.org/docs/Web/API/XMLHttpRequest/withCredentials | XMLHttpRequest.withCredentials}.
      */
     loadGltfFile(file: string | globalThis.File | ArrayBuffer | Blob, externalData?: Map<string, string | globalThis.File | ArrayBuffer | Blob>, params?: {

package/lib/Viewer/commands/index.d.ts

@@ -7,22 +7,16 @@ import { ICommandsRegistry } from "@inweb/viewer-core";
  * 1. Define a command handler with a first `viewer` parameter.
  * 2. Register command handler in the commands registry by calling the {@link commands.registerCommand}.
  *
- * @example Implementing a custom command.
+ * @example <caption>Implementing a custom command.</caption>
+ *   import { commands, Viewer } from "@inweb/viewer-three";
  *
- * ```javascript
- * import { commands, Viewer } from "@inweb/viewer-three";
+ *   function commandHandler(viewer: Viewer, name = "world"): void {
+ *     console.log(`Hello ${name}!!!`);
+ *   }
  *
- * function commandHandler(viewer: Viewer, name = "world"): void {
- *   console.log(`Hello ${name}!!!`);
- * }
+ *   commands.registerCommand("sayHello", commandHandler);
  *
- * commands.registerCommand("sayHello", commandHandler);
- * ```
- *
- * @example Calling a custom command.
- *
- * ```javascript
- * viewer.executeCommand("sayHello", "user");
- * ```
+ * @example <caption>Calling a custom command.</caption>
+ *   viewer.executeCommand("sayHello", "user");
  */
 export declare const commands: ICommandsRegistry;

package/lib/Viewer/components/DefaultPositionComponent.d.ts

@@ -0,0 +1,9 @@
+import { GeometryEndEvent, IComponent } from "@inweb/viewer-core";
+import type { Viewer } from "../Viewer";
+export declare class DefaultPositionComponent implements IComponent {
+    protected viewer: Viewer;
+    defaultCameraPositions: any;
+    constructor(viewer: Viewer);
+    dispose(): void;
+    geometryEnd: (event: GeometryEndEvent) => void;
+}

package/lib/Viewer/components/WCSHelperComponent.d.ts

@@ -5,6 +5,5 @@ export declare class WCSHelperComponent implements IComponent {
     private viewer;
     constructor(viewer: Viewer);
     dispose(): void;
-    geometryEnd: () => void;
     viewerRender: () => void;
 }

package/lib/Viewer/components/index.d.ts

@@ -6,35 +6,35 @@ import { IComponentsRegistry } from "@inweb/viewer-core";
  *
  * 1. Define a component class implements {@link IComponent}.
  * 2. Define a constructor with a `viewer` parameter and add mouse event listeners for the specified viewer.
- * 3. Define the component logic in the event listeners. For example, listen for the `mousedown` event and
- *    select objects when the left mouse button is pressed.
+ * 3. Define the component logic in the event listeners. For example, listen for the `mousedown`
+ *    event and select objects when the left mouse button is pressed.
  * 4. Override {@link IComponent.dispose} and remove mouse event listeners from the viewer.
  * 5. Register component provider in the components registry by calling the
  *    {@link components.registerComponent}.
  *
- * @example Implementing a custom component.
+ * @example <caption>Implementing a custom component.</caption>
+ *   import { IComponent, components, Viewer } from "@inweb/viewer-three";
  *
- * ```javascript
- * import { IComponent, components, Viewer } from "@inweb/viewer-three";
+ *   class MyComponent implements IComponent {
+ *     protected viewer: Viewer;
  *
- * class MyComponent implements IComponent {
- *   protected viewer: Viewer;
+ *     constructor(viewer: Viewer) {
+ *       this.viewer = viewer;
+ *       this.viewer.addEventListener("mousedown", this.onMouseDown);
+ *     }
  *
- *   constructor(viewer: Viewer) {
- *     this.viewer = viewer;
- *     this.viewer.addEventListener("mousedown", this.onMouseDown);
- *   }
+ *     override dispose() {
+ *       this.viewer.removeEventListener("mousedown", this.onMouseDown);
+ *     }
  *
- *   override dispose() {
- *     this.viewer.removeEventListener("mousedown", this.onMouseDown);
+ *     onMouseDown = (event: PointerEvent) => {
+ *       // place custom logic here
+ *     };
  *   }
  *
- *   onMouseDown = (event: PointerEvent) => {
- *     // place custom logic here
- *   };
- * }
- *
- * components.registerComponent("MyComponent", (viewer): IComponent => new MyComponent(viewer));
- * ```
+ *   components.registerComponent(
+ *     "MyComponent",
+ *     (viewer): IComponent => new MyComponent(viewer)
+ *   );
  */
 export declare const components: IComponentsRegistry;

package/lib/Viewer/draggers/OrbitDragger.d.ts

@@ -6,7 +6,6 @@ export declare class OrbitDragger implements IDragger {
     protected orbit: OrbitControls;
     protected changed: boolean;
     constructor(viewer: Viewer);
-    initialize(): void;
     dispose(): void;
     updateControls: () => void;
     controlsStart: () => void;

package/lib/Viewer/draggers/index.d.ts

@@ -6,40 +6,34 @@ import { IDraggersRegistry } from "@inweb/viewer-core";
  *
  * 1. Define a dragger class implements {@link IDragger}.
  * 2. Define a constructor with a `viewer` parameter and add mouse event listeners for the specified viewer.
- * 3. Define the dragger logic in the event listeners. For example, listen for the `mousemove` event and
- *    zoom in/out when the left mouse button is pressed.
+ * 3. Define the dragger logic in the event listeners. For example, listen for the `mousemove`
+ *    event and zoom in/out when the left mouse button is pressed.
  * 4. Override {@link IDragger.dispose} and remove mouse event listeners from the viewer.
  * 5. Register dragger provider in the draggers registry by calling the {@link draggers.registerDragger}.
  *
- * @example Implementing a custom dragger.
+ * @example <caption>Implementing a custom dragger.</caption>
+ *   import { IDragger, draggers, Viewer } from "@inweb/viewer-three";
  *
- * ```javascript
- * import { IDragger, draggers, Viewer } from "@inweb/viewer-three";
+ *   class MyDragger implements IDragger {
+ *     protected viewer: Viewer;
  *
- * class MyDragger implements IDragger {
- *   protected viewer: Viewer;
+ *     constructor(viewer: Viewer) {
+ *       this.viewer = viewer;
+ *       this.viewer.addEventListener("pointermove", this.onPointerMove);
+ *     }
  *
- *   constructor(viewer: Viewer) {
- *     this.viewer = viewer;
- *     this.viewer.addEventListener("pointermove", this.onPointerMove);
- *   }
+ *     override dispose() {
+ *       this.viewer.removeEventListener("pointermove", this.onPointerMove);
+ *     }
  *
- *   override dispose() {
- *     this.viewer.removeEventListener("pointermove", this.onPointerMove);
+ *     onPointerMove = (event: PointerEvent) => {
+ *       // place custom logic here
+ *     };
  *   }
  *
- *   onPointerMove = (event: PointerEvent) => {
- *     // place custom logic here
- *   };
- * }
- *
- * draggers.registerDragger("MyDragger", (viewer): IDragger => new MyDragger(viewer));
- * ```
- *
- * @example Activating a custom dragger.
+ *   draggers.registerDragger("MyDragger", (viewer): IDragger => new MyDragger(viewer));
  *
- * ```javascript
- * viewer.setActiveDragger("MyDragger");
- * ```
+ * @example <caption>Activating a custom dragger.</caption>
+ *   viewer.setActiveDragger("MyDragger");
  */
 export declare const draggers: IDraggersRegistry;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@inweb/viewer-three",
-  "version": "26.1.2",
+  "version": "26.1.4",
   "description": "JavaScript library for rendering CAD and BIM files in a browser using Three.js",
   "homepage": "https://cloud.opendesign.com/docs/index.html",
   "license": "SEE LICENSE IN LICENSE",
@@ -28,17 +28,17 @@
     "docs": "typedoc"
   },
   "dependencies": {
-    "@inweb/client": "~26.1.2",
-    "@inweb/eventemitter2": "~26.1.2",
-    "@inweb/markup": "~26.1.2",
-    "@inweb/viewer-core": "~26.1.2"
+    "@inweb/client": "~26.1.4",
+    "@inweb/eventemitter2": "~26.1.4",
+    "@inweb/markup": "~26.1.4",
+    "@inweb/viewer-core": "~26.1.4"
   },
   "devDependencies": {
-    "@types/three": "^0.173.0",
-    "three": "^0.173.0"
+    "@types/three": "^0.169.0",
+    "three": "^0.170.0"
   },
   "peerDependencies": {
-    "@types/three": "^0.173.0",
-    "three": "^0.173.0"
+    "@types/three": "^0.169.0",
+    "three": "^0.170.0"
   }
 }

package/src/Viewer/Viewer.ts

@@ -21,19 +21,7 @@
 // acknowledge and accept the above terms.
 ///////////////////////////////////////////////////////////////////////////////
 
-import {
-  Box3,
-  LinearToneMapping,
-  Object3D,
-  OrthographicCamera,
-  PerspectiveCamera,
-  Plane,
-  Scene,
-  Sphere,
-  Vector2,
-  Vector3,
-  WebGLRenderer,
-} from "three";
+import { Box3, LinearToneMapping, Object3D, PerspectiveCamera, Plane, Scene, Vector3, WebGLRenderer } from "three";
 import { GLTF, GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader.js";
 import { GLTFLoadingManager } from "./loaders/GLTFLoadingManager";
 
@@ -47,7 +35,6 @@ import {
   IEntity,
   IDragger,
   IOptions,
-  IOrthogonalCamera,
   IPerspectiveCamera,
   IPoint,
   IViewer,
@@ -60,6 +47,7 @@ import { IMarkup, IWorldTransform, Markup } from "@inweb/markup";
 
 import { draggers } from "./draggers";
 import { commands } from "./commands";
+
 import { components } from "./components";
 
 /**
@@ -79,7 +67,7 @@ export class Viewer
 
   public scene: Scene | undefined;
   public helpers: Scene | undefined;
-  public camera: PerspectiveCamera | OrthographicCamera | undefined;
+  public camera: PerspectiveCamera | undefined;
   public renderer: WebGLRenderer | undefined;
   public models: Array<GLTF>;
   public selected: Array<Object3D>;
@@ -95,9 +83,9 @@ export class Viewer
   private _markup: IMarkup;
 
   /**
-   * @param client - The `Client` instance that is used to load model reference files from the Open Cloud
-   *   Server. Do not specify `Client` if you need a standalone viewer instance to view `glTF` files from
-   *   the web or from local computer.
+   * @param client - The `Client` instance that is used to load model reference files from the
+   *   Open Cloud Server. Do not specify `Client` if you need a standalone viewer instance to
+   *   view `glTF` files from the web or from local computer.
    */
   constructor(client?: Client) {
     super();
@@ -154,8 +142,7 @@ export class Viewer
     const rect = canvas.parentElement.getBoundingClientRect();
     const width = rect.width || 1;
     const height = rect.height || 1;
-    const aspect = width / height;
-    this.camera = new PerspectiveCamera(45, aspect, 0.01, 1000);
+    this.camera = new PerspectiveCamera(45, width / height, 0.01, 1000);
     this.camera.up.set(0, 0, 1);
 
     this.renderer = new WebGLRenderer({ canvas, antialias: true, preserveDrawingBuffer: true });
@@ -168,7 +155,7 @@ export class Viewer
 
     this._markup.initialize(this.canvas, this.canvasEvents, this, this);
 
-    for (const name of components.getComponents().keys()) {
+    for (let name of components.getComponents().keys()) {
       this._components.push(components.createComponent(name, this));
     }
 
@@ -263,12 +250,12 @@ export class Viewer
    *
    * The file geometry data on the server must be converted to `glTF` format.
    *
-   * This method requires a `Client` instance to be specified when creating the viewer to load model
-   * reference files from the Open Cloud Server. For a standalone viewer instance use
+   * This method requires a `Client` instance to be specified when creating the viewer to load
+   * model reference files from the Open Cloud Server. For a standalone viewer instance use
    * {@link openGltfFile | openGltfFile()}.
    *
-   * If there was an active dragger before opening the file, it will be deactivated. After opening the
-   * file, you must manually activate the required dragger.
+   * If there was an active dragger before opening the file, it will be deactivated. After
+   * opening the file, you must manually activate the required dragger.
    *
    * Fires:
    *
@@ -280,9 +267,9 @@ export class Viewer
    * - {@link GeometryEndEvent | geometryend}
    * - {@link GeometryErrorEvent | geometryerror}
    *
-   * @param file - File, assembly or specific model to load. If a `File` instance with multiple models is
-   *   specified, the default model will be loaded. If there is no default model, first availiable model
-   *   will be loaded.
+   * @param file - File, assembly or specific model to load. If a `File` instance with multiple
+   *   models is specified, the default model will be loaded. If there is no default model,
+   *   first availiable model will be loaded.
    */
   async open(file: Model | File | Assembly): Promise<this> {
     if (!this.renderer) return this;
@@ -319,8 +306,8 @@ export class Viewer
   /**
    * Loads a `glTF` file into the viewer.
    *
-   * If there was an active dragger before opening the file, it will be deactivated. After opening the
-   * file, you must manually activate the required dragger.
+   * If there was an active dragger before opening the file, it will be deactivated. After
+   * opening the file, you must manually activate the required dragger.
    *
    * Fires:
    *
@@ -332,22 +319,22 @@ export class Viewer
    * - {@link GeometryErrorEvent | geometryerror}
    *
    * @param file - File URL or binary data buffer to load.
-   * @param externalData - External resource map such as binary data buffers or images. Each resource
-   *   should be represented by a `uri` and a corresponding resource URL, or
+   * @param externalData - External resource map such as binary data buffers or images. Each
+   *   resource should be represented by a `uri` and a corresponding resource URL, or
    *   {@link https://developer.mozilla.org/docs/Web/API/File | Web API File} object, or
    *   {@link https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer | ArrayBuffer}
    *   or {@link https://developer.mozilla.org/docs/Web/API/Blob/Blob | Blob}, or
    *   {@link https://developer.mozilla.org/docs/Web/HTTP/Basics_of_HTTP/Data_URIs | Data URL} string,
    * @param params - Loader parameters.
-   * @param params.path - The base path from which to find subsequent glTF resources such as textures and
-   *   .bin data files. If not defined, the base path of the file URL will be used.
+   * @param params.path - The base path from which to find subsequent glTF resources such as
+   *   textures and .bin data files. If not defined, the base path of the file URL will be used.
    * @param params.requestHeader - The
-   *   {@link https://developer.mozilla.org/docs/Glossary/Request_header | request header} used in HTTP
-   *   request.
-   * @param params.crossOrigin - The crossOrigin string to implement CORS for loading the url from a
-   *   different domain that allows CORS. Default is `anonymous`.
-   * @param params.withCredentials - Whether the XMLHttpRequest uses credentials such as cookies,
-   *   authorization headers or TLS client certificates. See
+   *   {@link https://developer.mozilla.org/docs/Glossary/Request_header | request header} used
+   *   in HTTP request.
+   * @param params.crossOrigin - The crossOrigin string to implement CORS for loading the url
+   *   from a different domain that allows CORS. Default is `anonymous`.
+   * @param params.withCredentials - Whether the XMLHttpRequest uses credentials such as
+   *   cookies, authorization headers or TLS client certificates. See
    *   {@link https://developer.mozilla.org/docs/Web/API/XMLHttpRequest/withCredentials | XMLHttpRequest.withCredentials}.
    */
   openGltfFile(
@@ -383,22 +370,22 @@ export class Viewer
    * - {@link GeometryErrorEvent | geometryerror}
    *
    * @param file - File URL or binary data buffer to load.
-   * @param externalData - External resource map such as binary data buffers or images. Each resource
-   *   should be represented by a `uri` and a corresponding resource URL, or
+   * @param externalData - External resource map such as binary data buffers or images. Each
+   *   resource should be represented by a `uri` and a corresponding resource URL, or
    *   {@link https://developer.mozilla.org/docs/Web/API/File | Web API File} object, or
    *   {@link https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer | ArrayBuffer}
    *   or {@link https://developer.mozilla.org/docs/Web/API/Blob/Blob | Blob}, or
    *   {@link https://developer.mozilla.org/docs/Web/HTTP/Basics_of_HTTP/Data_URIs | Data URL} string,
    * @param params - Loader parameters.
-   * @param params.path - The base path from which to find subsequent glTF resources such as textures and
-   *   .bin data files.
+   * @param params.path - The base path from which to find subsequent glTF resources such as
+   *   textures and .bin data files.
    * @param params.requestHeader - The
-   *   {@link https://developer.mozilla.org/docs/Glossary/Request_header | request header} used in HTTP
-   *   request.
-   * @param params.crossOrigin - The crossOrigin string to implement CORS for loading the url from a
-   *   different domain that allows CORS. Default is `anonymous`.
-   * @param params.withCredentials - Whether the XMLHttpRequest uses credentials such as cookies,
-   *   authorization headers or TLS client certificates. See
+   *   {@link https://developer.mozilla.org/docs/Glossary/Request_header | request header} used
+   *   in HTTP request.
+   * @param params.crossOrigin - The crossOrigin string to implement CORS for loading the url
+   *   from a different domain that allows CORS. Default is `anonymous`.
+   * @param params.withCredentials - Whether the XMLHttpRequest uses credentials such as
+   *   cookies, authorization headers or TLS client certificates. See
    *   {@link https://developer.mozilla.org/docs/Web/API/XMLHttpRequest/withCredentials | XMLHttpRequest.withCredentials}.
    */
   async loadGltfFile(
@@ -629,46 +616,14 @@ export class Viewer
 
     const getVector3FromPoint3d = ({ x, y, z }): Vector3 => new Vector3(x, y, z);
 
-    const setOrthogonalCamera = (orthogonal_camera: IOrthogonalCamera) => {
-      if (orthogonal_camera) {
-        const extentsSize = this.extents.getBoundingSphere(new Sphere()).radius * 2;
-        const rendererSize = this.renderer.getSize(new Vector2());
-        const aspect = rendererSize.x / rendererSize.y;
-
-        this.camera = new OrthographicCamera();
-        this.camera.top = orthogonal_camera.field_height / 2;
-        this.camera.bottom = -orthogonal_camera.field_height / 2;
-        this.camera.left = this.camera.bottom * aspect;
-        this.camera.right = this.camera.top * aspect;
-        this.camera.near = 0;
-        this.camera.far = extentsSize * 100;
-        this.camera.zoom = orthogonal_camera.view_to_world_scale;
-        this.camera.updateProjectionMatrix();
-
-        this.camera.up.copy(getVector3FromPoint3d(orthogonal_camera.up_vector));
-        this.camera.position.copy(getVector3FromPoint3d(orthogonal_camera.view_point));
-        this.camera.lookAt(getVector3FromPoint3d(orthogonal_camera.direction).add(this.camera.position));
+    const setPerspectiveCamera = (camera: IPerspectiveCamera) => {
+      if (camera) {
+        this.camera.up.copy(getVector3FromPoint3d(camera.up_vector));
+        this.camera.fov = camera.field_of_view;
+        this.camera.position.copy(getVector3FromPoint3d(camera.view_point));
+        this.camera.lookAt(getVector3FromPoint3d(camera.direction).add(this.camera.position));
         this.camera.updateMatrixWorld();
-      }
-    };
-
-    const setPerspectiveCamera = (perspective_camera: IPerspectiveCamera) => {
-      if (perspective_camera) {
-        const extentsSize = this.extents.getBoundingSphere(new Sphere()).radius * 2;
-        const rendererSize = this.renderer.getSize(new Vector2());
-        const aspect = rendererSize.x / rendererSize.y;
-
-        this.camera = new PerspectiveCamera();
-        this.camera.fov = perspective_camera.field_of_view;
-        this.camera.aspect = aspect;
-        this.camera.near = extentsSize / 100;
-        this.camera.far = extentsSize * 100;
         this.camera.updateProjectionMatrix();
-
-        this.camera.up.copy(getVector3FromPoint3d(perspective_camera.up_vector));
-        this.camera.position.copy(getVector3FromPoint3d(perspective_camera.view_point));
-        this.camera.lookAt(getVector3FromPoint3d(perspective_camera.direction).add(this.camera.position));
-        this.camera.updateMatrixWorld();
       }
     };
 
@@ -685,7 +640,7 @@ export class Viewer
     };
 
     const setSelection = (selection: IEntity[]) => {
-      if (selection) this.setSelected(selection.map((component) => component.handle));
+      this.setSelected(selection?.map((component) => component.handle));
     };
 
     const draggerName = this._activeDragger?.name;
@@ -698,7 +653,6 @@ export class Viewer
     this.showAll();
     this.explode();
 
-    setOrthogonalCamera(viewpoint.orthogonal_camera);
     setPerspectiveCamera(viewpoint.perspective_camera);
     setClippingPlanes(viewpoint.clipping_planes);
     setSelection(viewpoint.selection);
@@ -716,28 +670,13 @@ export class Viewer
 
     const getPoint3dFromVector3 = ({ x, y, z }): IPoint => ({ x, y, z });
 
-    const getOrthogonalCamera = (): IOrthogonalCamera => {
-      if (this.camera["isOrthographicCamera"])
-        return {
-          view_point: getPoint3dFromVector3(this.camera.position),
-          direction: getPoint3dFromVector3(this.camera.getWorldDirection(new Vector3())),
-          up_vector: getPoint3dFromVector3(this.camera.up),
-          field_width: this.camera["right"] - this.camera["left"],
-          field_height: this.camera["top"] - this.camera["bottom"],
-          view_to_world_scale: this.camera.zoom,
-        };
-      else return undefined;
-    };
-
     const getPerspectiveCamera = (): IPerspectiveCamera => {
-      if (this.camera["isPerspectiveCamera"])
-        return {
-          view_point: getPoint3dFromVector3(this.camera.position),
-          direction: getPoint3dFromVector3(this.camera.getWorldDirection(new Vector3())),
-          up_vector: getPoint3dFromVector3(this.camera.up),
-          field_of_view: this.camera["fov"],
-        };
-      else return undefined;
+      return {
+        view_point: getPoint3dFromVector3(this.camera.position),
+        direction: getPoint3dFromVector3(this.camera.getWorldDirection(new Vector3())),
+        up_vector: getPoint3dFromVector3(this.camera.up),
+        field_of_view: this.camera.fov,
+      };
     };
 
     const getClippingPlanes = (): IClippingPlane[] => {
@@ -758,7 +697,6 @@ export class Viewer
 
     const viewpoint: IViewpoint = { custom_fields: {} };
 
-    viewpoint.orthogonal_camera = getOrthogonalCamera();
     viewpoint.perspective_camera = getPerspectiveCamera();
     viewpoint.clipping_planes = getClippingPlanes();
     viewpoint.selection = getSelection();