@inweb/viewer-three 27.4.7 → 27.6.0

package/src/Viewer/Viewer.ts

@@ -23,6 +23,7 @@
 
 import {
   Box3,
+  Group,
   LinearSRGBColorSpace,
   // LinearToneMapping,
   Object3D,
@@ -34,12 +35,13 @@ import {
   Vector2,
   Vector3,
   WebGLRenderer,
+  WebGLRenderTarget,
 } from "three";
 import { EffectComposer } from "three/examples/jsm/postprocessing/EffectComposer.js";
 import { RenderPass } from "three/examples/jsm/postprocessing/RenderPass.js";
 import { FXAAPass } from "three/examples/jsm/postprocessing/FXAAPass.js";
 import { SMAAPass } from "three/examples/jsm/postprocessing/SMAAPass.js";
-import { SSAARenderPass } from "./postprocessing/SSAARenderPass.js";
+import { SSAARenderPass } from "three/examples/jsm/postprocessing/SSAARenderPass.js";
 import { OutputPass } from "three/examples/jsm/postprocessing/OutputPass.js";
 
 import { EventEmitter2 } from "@inweb/eventemitter2";
@@ -72,7 +74,6 @@ import { commands } from "./commands";
 import { components } from "./components";
 import { loaders } from "./loaders";
 import { IModelImpl } from "./models/IModelImpl";
-import { Helpers } from "./scenes/Helpers";
 
 /**
  * 3D viewer powered by {@link https://threejs.org/ | Three.js}.
@@ -92,11 +93,10 @@ export class Viewer
   private canvaseventlistener: (event: any) => void;
 
   public scene: Scene | undefined;
-  public helpers: Helpers | undefined;
+  public helpers: Group | undefined;
   public camera: PerspectiveCamera | OrthographicCamera | undefined;
   public renderer: WebGLRenderer | undefined;
   public renderPass: RenderPass | undefined;
-  public helpersPass: RenderPass | undefined;
   public fxaaPass: FXAAPass | undefined;
   public smaaPass: SMAAPass | undefined;
   public ssaaRenderPass: SSAARenderPass | undefined;
@@ -105,11 +105,11 @@ export class Viewer
   public selected: Object3D[];
   public extents: Box3;
   public target: Vector3;
+  public clippingPlanes: Plane[];
 
   private _activeDragger: IDragger | null;
   private _components: IComponent[];
 
-  private _updateDelay: number;
   private _renderNeeded: boolean;
   private _renderTime: DOMHighResTimeStamp;
 
@@ -134,11 +134,11 @@ export class Viewer
     this.selected = [];
     this.extents = new Box3();
     this.target = new Vector3(0, 0, 0);
+    this.clippingPlanes = [];
 
     this._activeDragger = null;
     this._components = [];
 
-    this._updateDelay = 1000;
     this._renderNeeded = false;
     this._renderTime = 0;
 
@@ -171,7 +171,10 @@ export class Viewer
     this.addEventListener("optionschange", (event) => this.syncOptions(event.data));
 
     this.scene = new Scene();
-    this.helpers = new Helpers();
+
+    this.helpers = new Group();
+    this.helpers.name = "Helpers";
+    this.scene.add(this.helpers);
 
     const pixelRatio = window.devicePixelRatio;
     const rect = canvas.parentElement.getBoundingClientRect();
@@ -191,25 +194,26 @@ export class Viewer
       alpha: true,
       preserveDrawingBuffer: true,
       powerPreference: "high-performance",
-      logarithmicDepthBuffer: true,
+      logarithmicDepthBuffer: true, // <- required for sections filling
     });
     this.renderer.setPixelRatio(pixelRatio);
     this.renderer.setSize(width, height);
     this.renderer.outputColorSpace = LinearSRGBColorSpace;
     // this.renderer.toneMapping = LinearToneMapping;
+    this.renderer.localClippingEnabled = true;
 
     this.renderPass = new RenderPass(this.scene, this.camera);
-    this.helpersPass = new RenderPass(this.helpers, this.camera);
-    this.helpersPass.clear = false;
     this.fxaaPass = new FXAAPass();
     this.smaaPass = new SMAAPass();
-    this.ssaaRenderPass = new SSAARenderPass([this.scene, this.helpers], this.camera);
+    this.ssaaRenderPass = new SSAARenderPass(this.scene, this.camera);
     this.ssaaRenderPass.unbiased = true;
     this.outputPass = new OutputPass();
 
-    this.composer = new EffectComposer(this.renderer);
+    const renderTarget = new WebGLRenderTarget(1, 1, { samples: 4 });
+    renderTarget.texture.name = "EffectComposer.rt1";
+
+    this.composer = new EffectComposer(this.renderer, renderTarget);
     this.composer.addPass(this.renderPass);
-    this.composer.addPass(this.helpersPass);
     this.composer.addPass(this.smaaPass);
     this.composer.addPass(this.fxaaPass);
     this.composer.addPass(this.ssaaRenderPass);
@@ -222,7 +226,8 @@ export class Viewer
     this._markup.initialize(this.canvas, this.canvasEvents, this, this);
 
     for (const name of components.getComponents().keys()) {
-      this._components.push(components.createComponent(name, this));
+      const component = components.createComponent(name, this);
+      if (component) this._components.push(component);
     }
 
     this.syncOptions();
@@ -252,7 +257,7 @@ export class Viewer
     this.setActiveDragger();
 
     this._components.forEach((component: IComponent) => component.dispose());
-    this._components = [];
+    this._components.length = 0;
 
     this._markup.dispose();
 
@@ -263,7 +268,6 @@ export class Viewer
 
     if (this.composer) this.composer.dispose();
     if (this.renderPass) this.renderPass.dispose();
-    if (this.helpersPass) this.helpersPass.dispose();
     if (this.fxaaPass) this.fxaaPass.dispose();
     if (this.smaaPass) this.smaaPass.dispose();
     if (this.ssaaRenderPass) this.ssaaRenderPass.dispose();
@@ -275,7 +279,6 @@ export class Viewer
     this.camera = undefined;
     this.renderer = undefined;
     this.renderPass = undefined;
-    this.helpersPass = undefined;
     this.fxaaPass = undefined;
     this.smaaPass = undefined;
     this.ssaaRenderPass = undefined;
@@ -312,14 +315,14 @@ export class Viewer
     this.update(true);
   }
 
-  update(force = false): void {
+  update(force: boolean | number = false): void {
     const time = performance.now();
-    force = force || time - this._renderTime >= this._updateDelay;
+    if (typeof force === "number" && time - this._renderTime >= force) force = true;
 
     this._renderNeeded = true;
     if (force) this.render(time);
 
-    this.emitEvent({ type: "update", force });
+    this.emitEvent({ type: "update", force: !!force });
   }
 
   // Internal render routines
@@ -337,12 +340,7 @@ export class Viewer
     this.renderer.info.autoReset = false;
     this.renderer.info.reset();
 
-    if (this.options.antialiasing === true || this.options.antialiasing === "msaa") {
-      this.renderer.render(this.scene, this.camera);
-      this.renderer.render(this.helpers, this.camera);
-    } else {
-      this.composer.render(deltaTime);
-    }
+    this.composer.render(deltaTime);
 
     this.emitEvent({ type: "render", time, deltaTime });
   }
@@ -461,7 +459,7 @@ export class Viewer
     if (!format && typeof file === "string") format = file.split(".").pop();
     if (!format && file instanceof globalThis.File) format = file.name.split(".").pop();
 
-    const loader: ILoader = loaders.createLoader(this, model, format);
+    const loader: ILoader | null = loaders.createLoader(this, model, format);
     if (!loader) throw new Error(`Format not supported (${format})`);
     this.loaders.push(loader);
 
@@ -495,14 +493,16 @@ export class Viewer
     this.clearSelected();
 
     this.loaders.forEach((loader) => loader.dispose());
-    this.loaders = [];
+    this.loaders.length = 0;
 
     this.models.forEach((model) => model.dispose());
-    this.models = [];
+    this.models.length = 0;
 
-    this.scene.clear();
     this.helpers.clear();
 
+    this.scene.clear();
+    this.scene.add(this.helpers);
+
     this.extents.makeEmpty();
 
     this.syncOptions();
@@ -524,9 +524,19 @@ export class Viewer
     this.fxaaPass.enabled = options.antialiasing === "fxaa";
     this.smaaPass.enabled = options.antialiasing === "smaa";
     this.ssaaRenderPass.enabled = options.antialiasing === "ssaa";
+    this.renderPass.enabled = options.antialiasing !== "ssaa";
+
+    const samples = options.antialiasing === true || options.antialiasing === "msaa" ? 4 : 0;
+
+    if (this.composer.renderTarget1.samples !== samples) {
+      const size = this.renderer.getSize(new Vector2());
+
+      const newRenderTarget = new WebGLRenderTarget(1, 1, { samples });
+      newRenderTarget.texture.name = "EffectComposer.rt1";
 
-    this.renderPass.enabled = !this.ssaaRenderPass.enabled;
-    this.helpersPass.enabled = !this.ssaaRenderPass.enabled;
+      this.composer.reset(newRenderTarget);
+      this.composer.setSize(size.x, size.y);
+    }
 
     this.update();
   }
@@ -550,8 +560,9 @@ export class Viewer
   clearSlices(): void {
     if (!this.renderer) return;
 
-    this.renderer.clippingPlanes = [];
+    this.clippingPlanes.length = 0;
 
+    this.emitEvent({ type: "changecuttingplanes" });
     this.emitEvent({ type: "clearslices" });
     this.update();
   }
@@ -602,8 +613,8 @@ export class Viewer
 
   setActiveDragger(name = ""): IDragger | null {
     if (!this._activeDragger || this._activeDragger.name !== name) {
-      const oldDragger = this._activeDragger;
-      let newDragger = null;
+      const oldDragger: IDragger | null = this._activeDragger;
+      let newDragger: IDragger | null = null;
 
       if (this._activeDragger) {
         this._activeDragger.dispose();
@@ -634,8 +645,8 @@ export class Viewer
     }
   }
 
-  getComponent(name: string): IComponent {
-    return this._components.find((component) => component.name === name);
+  getComponent(name: string): IComponent | null {
+    return this._components.find((component) => component.name === name) || null;
   }
 
   drawViewpoint(viewpoint: IViewpoint): void {
@@ -643,7 +654,7 @@ export class Viewer
 
     const getVector3FromPoint3d = ({ x, y, z }): Vector3 => new Vector3(x, y, z);
 
-    const setOrthogonalCamera = (orthogonal_camera: IOrthogonalCamera) => {
+    const setOrthogonalCamera = (orthogonal_camera?: IOrthogonalCamera) => {
       if (orthogonal_camera) {
         const extentsSize = this.extents.getSize(new Vector3()).length() || 1;
         const rendererSize = this.renderer.getSize(new Vector2());
@@ -666,7 +677,6 @@ export class Viewer
 
         this.camera = camera;
         this.renderPass.camera = camera;
-        this.helpersPass.camera = camera;
         this.ssaaRenderPass.camera = camera;
 
         this.options.cameraMode = "orthographic";
@@ -674,7 +684,7 @@ export class Viewer
       }
     };
 
-    const setPerspectiveCamera = (perspective_camera: IPerspectiveCamera) => {
+    const setPerspectiveCamera = (perspective_camera?: IPerspectiveCamera) => {
       if (perspective_camera) {
         const extentsSize = this.extents.getSize(new Vector3()).length() || 1;
         const rendererSize = this.renderer.getSize(new Vector2());
@@ -694,7 +704,6 @@ export class Viewer
 
         this.camera = camera;
         this.renderPass.camera = camera;
-        this.helpersPass.camera = camera;
         this.ssaaRenderPass.camera = camera;
 
         this.options.cameraMode = "perspective";
@@ -702,7 +711,7 @@ export class Viewer
       }
     };
 
-    const setClippingPlanes = (clipping_planes: IClippingPlane[]) => {
+    const setClippingPlanes = (clipping_planes?: IClippingPlane[]) => {
       if (clipping_planes) {
         clipping_planes.forEach((clipping_plane) => {
           const plane = new Plane();
@@ -711,8 +720,10 @@ export class Viewer
             getVector3FromPoint3d(clipping_plane.location)
           );
 
-          this.renderer.clippingPlanes.push(plane);
+          this.clippingPlanes.push(plane);
         });
+
+        this.emitEvent({ type: "changecuttingplanes" });
       }
     };
 
@@ -725,8 +736,8 @@ export class Viewer
     this.setActiveDragger();
     this.clearSlices();
     this.clearOverlay();
-
     this.clearSelected();
+
     this.showAll();
     this.explode();
 
@@ -751,7 +762,7 @@ export class Viewer
 
     const getPoint3dFromVector3 = ({ x, y, z }): IPoint => ({ x, y, z });
 
-    const getOrthogonalCamera = (): IOrthogonalCamera => {
+    const getOrthogonalCamera = (): IOrthogonalCamera | undefined => {
       if (this.camera["isOrthographicCamera"])
         return {
           view_point: getPoint3dFromVector3(this.camera.position),
@@ -764,7 +775,7 @@ export class Viewer
       else return undefined;
     };
 
-    const getPerspectiveCamera = (): IPerspectiveCamera => {
+    const getPerspectiveCamera = (): IPerspectiveCamera | undefined => {
       if (this.camera["isPerspectiveCamera"])
         return {
           view_point: getPoint3dFromVector3(this.camera.position),
@@ -776,8 +787,8 @@ export class Viewer
     };
 
     const getClippingPlanes = (): IClippingPlane[] => {
-      const clipping_planes = [];
-      this.renderer.clippingPlanes.forEach((plane: Plane) => {
+      const clipping_planes: IClippingPlane[] = [];
+      this.clippingPlanes.forEach((plane: Plane) => {
         const clipping_plane = {
           location: getPoint3dFromVector3(plane.coplanarPoint(new Vector3())),
           direction: getPoint3dFromVector3(plane.normal),

package/src/Viewer/commands/GetSelected2.ts

@@ -24,7 +24,7 @@
 import type { Viewer } from "../Viewer";
 
 export function getSelected2(viewer: Viewer): string[] {
-  const handles2 = [];
+  const handles2: string[][] = [];
 
   viewer.models.forEach((model) => {
     handles2.push(model.getHandlesByObjects(viewer.selected));

package/src/Viewer/commands/SetSelected.ts

@@ -24,7 +24,7 @@
 import type { Viewer } from "../Viewer";
 
 export function setSelected(viewer: Viewer, handles: string[] = []): void {
-  const handles2 = [];
+  const handles2: string[] = [];
 
   handles.forEach((handle) => {
     if (handle.includes(":")) {

package/src/Viewer/commands/index.ts

@@ -110,8 +110,8 @@ commands.registerCommand("left", (viewer) => setDefaultViewPosition(viewer, "lef
 commands.registerCommand("right", (viewer) => setDefaultViewPosition(viewer, "right"));
 commands.registerCommand("front", (viewer) => setDefaultViewPosition(viewer, "front"));
 commands.registerCommand("back", (viewer) => setDefaultViewPosition(viewer, "back"));
-commands.registerCommand("sw", (viewer) => setDefaultViewPosition(viewer, "sw"));
 commands.registerCommand("se", (viewer) => setDefaultViewPosition(viewer, "se"));
+commands.registerCommand("sw", (viewer) => setDefaultViewPosition(viewer, "sw"));
 commands.registerCommand("ne", (viewer) => setDefaultViewPosition(viewer, "ne"));
 commands.registerCommand("nw", (viewer) => setDefaultViewPosition(viewer, "nw"));
 

package/src/Viewer/components/BackgroundComponent.ts

@@ -42,11 +42,12 @@ export class BackgroundComponent implements IComponent {
 
   dispose() {
     this.viewer.removeEventListener("optionschange", this.syncOptions);
-    this.viewer.scene.background = undefined;
+    this.viewer.scene.background = null;
   }
 
   syncOptions = () => {
     this.backgroundColor.setHex(0xffffff);
     this.viewer.renderer.setClearColor(this.backgroundColor);
+    this.viewer.update();
   };
 }

package/src/Viewer/components/CameraComponent.ts

@@ -32,14 +32,14 @@ export class CameraComponent implements IComponent {
   constructor(viewer: Viewer) {
     this.viewer = viewer;
     this.viewer.addEventListener("databasechunk", this.geometryEnd);
-    this.viewer.addEventListener("optionschange", this.optionsChange);
-    this.viewer.addEventListener("initialize", this.optionsChange);
+    this.viewer.addEventListener("optionschange", this.syncOptions);
+    this.viewer.addEventListener("initialize", this.syncOptions);
   }
 
   dispose() {
     this.viewer.removeEventListener("databasechunk", this.geometryEnd);
-    this.viewer.removeEventListener("optionschange", this.optionsChange);
-    this.viewer.removeEventListener("initialize", this.optionsChange);
+    this.viewer.removeEventListener("optionschange", this.syncOptions);
+    this.viewer.removeEventListener("initialize", this.syncOptions);
   }
 
   getCameraMode(camera: any): CameraMode {
@@ -67,7 +67,6 @@ export class CameraComponent implements IComponent {
 
     this.viewer.camera = camera;
     this.viewer.renderPass.camera = camera;
-    this.viewer.helpersPass.camera = camera;
     this.viewer.ssaaRenderPass.camera = camera;
 
     this.viewer.update();
@@ -81,7 +80,7 @@ export class CameraComponent implements IComponent {
 
     const target = this.viewer.target.clone();
 
-    let camera: PerspectiveCamera | OrthographicCamera;
+    let camera: PerspectiveCamera | OrthographicCamera | null = null;
 
     if (currentCamera.isOrthographicCamera) {
       const fov = currentCamera.userData.fov || 45;
@@ -114,7 +113,7 @@ export class CameraComponent implements IComponent {
     this.viewer.emitEvent({ type: "changecameramode", mode });
   }
 
-  optionsChange = () => {
+  syncOptions = () => {
     this.switchCameraMode(this.viewer.options.cameraMode);
   };
 

package/src/Viewer/components/CanvasRemoveComponent.ts

@@ -36,7 +36,6 @@ export class CanvasRemoveComponent implements IComponent {
 
   dispose() {
     this.mutationObserver.disconnect();
-    this.mutationObserver = undefined;
   }
 
   cleanupViewer = (mutations: MutationRecord[]) => {

package/src/Viewer/{scenes/Helpers.ts → components/ClippingPlaneComponent.ts}

@@ -21,22 +21,32 @@
 // acknowledge and accept the above terms.
 ///////////////////////////////////////////////////////////////////////////////
 
-import { Scene, WebGLRenderer } from "three";
+import { IComponent } from "@inweb/viewer-core";
+import type { Viewer } from "../Viewer";
 
-export class Helpers extends Scene {
-  private oldAutoClear = false;
-  private oldClippingPlanes = [];
+export class ClippingPlaneComponent implements IComponent {
+  protected viewer: Viewer;
 
-  override onBeforeRender(renderer: WebGLRenderer): void {
-    this.oldAutoClear = renderer.autoClear;
-    this.oldClippingPlanes = renderer.clippingPlanes;
+  constructor(viewer: Viewer) {
+    this.viewer = viewer;
 
-    renderer.autoClear = false;
-    renderer.clippingPlanes = [];
+    this.viewer.addEventListener("geometryend", this.applyClippingPlanes);
+    this.viewer.addEventListener("changecuttingplanes", this.applyClippingPlanes);
   }
 
-  override onAfterRender(renderer: WebGLRenderer): void {
-    renderer.clippingPlanes = this.oldClippingPlanes;
-    renderer.autoClear = this.oldAutoClear;
+  dispose() {
+    this.viewer.removeEventListener("geometryend", this.applyClippingPlanes);
+    this.viewer.removeEventListener("changecuttingplanes", this.applyClippingPlanes);
   }
+
+  applyClippingPlanes = () => {
+    this.viewer.models.forEach((model) => {
+      model.scene.traverse((object: any) => {
+        if (object.material) {
+          const materials = Array.isArray(object.material) ? object.material : [object.material];
+          materials.forEach((material) => (material.clippingPlanes = this.viewer.clippingPlanes));
+        }
+      });
+    });
+  };
 }

package/src/Viewer/components/HighlighterComponent.ts

@@ -62,7 +62,7 @@ export class HighlighterComponent implements IComponent {
     }
 
     this.viewer.addEventListener("databasechunk", this.geometryEnd);
-    this.viewer.addEventListener("optionschange", this.optionsChange);
+    this.viewer.addEventListener("optionschange", this.syncOptions);
     this.viewer.addEventListener("resize", this.viewerResize);
 
     this.geometryEnd();
@@ -70,7 +70,7 @@ export class HighlighterComponent implements IComponent {
 
   dispose() {
     this.viewer.removeEventListener("databasechunk", this.geometryEnd);
-    this.viewer.removeEventListener("optionschange", this.optionsChange);
+    this.viewer.removeEventListener("optionschange", this.syncOptions);
     this.viewer.removeEventListener("resize", this.viewerResize);
   }
 
@@ -143,17 +143,20 @@ export class HighlighterComponent implements IComponent {
       polygonOffset: true,
       polygonOffsetFactor: 1,
       polygonOffsetUnits: 1,
+      clippingPlanes: this.viewer.clippingPlanes,
     });
 
     this.edgesMaterial = new LineMaterial({
       linewidth: 1.5,
       resolution: new Vector2(window.innerWidth, window.innerHeight),
+      clippingPlanes: this.viewer.clippingPlanes,
     });
 
     this.lineMaterial = new LineBasicMaterial({
       transparent: true,
       depthTest: true,
       depthWrite: true,
+      clippingPlanes: this.viewer.clippingPlanes,
     });
 
     this.lineGlowMaterial = new LineMaterial({
@@ -161,12 +164,13 @@ export class HighlighterComponent implements IComponent {
       transparent: true,
       opacity: 0.8,
       resolution: new Vector2(window.innerWidth, window.innerHeight),
+      clippingPlanes: this.viewer.clippingPlanes,
     });
 
     this.syncHighlightColors();
   };
 
-  optionsChange = () => {
+  syncOptions = () => {
     this.syncHighlightColors();
     this.viewer.update();
   };
@@ -198,9 +202,9 @@ export class HighlighterComponent implements IComponent {
     });
   }
 
-  viewerResize(event: ResizeEvent) {
+  viewerResize = (event: ResizeEvent) => {
     this.renderTarget?.setSize(event.width, event.height);
     this.edgesMaterial?.resolution.set(event.width, event.height);
     this.lineGlowMaterial?.resolution.set(event.width, event.height);
-  }
+  };
 }

package/src/Viewer/components/HighlighterUtils.ts

@@ -40,7 +40,7 @@ export class HighlighterUtils {
 
   static fromIndexedLine(positions: Float32Array, indices: number[]) {
     const lineGeometry = new LineSegmentsGeometry();
-    const segments = [];
+    const segments: number[] = [];
 
     for (let i = 0; i < indices.length; i += 2) {
       const idx1 = indices[i] * 3;
@@ -68,7 +68,7 @@ export class HighlighterUtils {
 
   static fromNonIndexedLine(positions: Float32Array, isLineSegments: boolean) {
     const lineGeometry = new LineSegmentsGeometry();
-    const segments = [];
+    const segments: number[] = [];
 
     if (isLineSegments) {
       for (let i = 0; i < positions.length; i += 6) {

package/src/Viewer/components/InfoComponent.ts

@@ -40,7 +40,7 @@ export class InfoComponent implements IComponent {
     this.frames = 0;
     this.viewer.addEventListener("initialize", this.initialize);
     this.viewer.addEventListener("clear", this.clear);
-    this.viewer.addEventListener("optionschange", this.optionsChange);
+    this.viewer.addEventListener("optionschange", this.syncOptions);
     this.viewer.addEventListener("geometrystart", this.geometryStart);
     this.viewer.addEventListener("databasechunk", this.databaseChunk);
     this.viewer.addEventListener("geometryend", this.geometryEnd);
@@ -52,7 +52,7 @@ export class InfoComponent implements IComponent {
   dispose() {
     this.viewer.removeEventListener("initialize", this.initialize);
     this.viewer.removeEventListener("clear", this.clear);
-    this.viewer.removeEventListener("optionschange", this.optionsChange);
+    this.viewer.removeEventListener("optionschange", this.syncOptions);
     this.viewer.removeEventListener("geometrystart", this.geometryStart);
     this.viewer.removeEventListener("databasechunk", this.databaseChunk);
     this.viewer.removeEventListener("geometryend", this.geometryEnd);
@@ -79,7 +79,7 @@ export class InfoComponent implements IComponent {
 
     this.resize();
 
-    this.optionsChange({ data: this.viewer.options });
+    this.syncOptions({ data: this.viewer.options });
   };
 
   clear = () => {
@@ -108,7 +108,7 @@ export class InfoComponent implements IComponent {
     this.viewer.info.memory.usedJSHeapSize = 0;
   };
 
-  optionsChange = ({ data: options }) => {
+  syncOptions = ({ data: options }) => {
     if (options.antialiasing === false) this.viewer.info.render.antialiasing = "";
     else if (options.antialiasing === true) this.viewer.info.render.antialiasing = "mxaa";
     else this.viewer.info.render.antialiasing = options.antialiasing;