@inweb/viewer-three 27.4.7 → 27.6.0

package/src/Viewer/loaders/DynamicGltfLoader/DynamicModelImpl.ts

@@ -62,7 +62,7 @@ export class DynamicModelImpl extends ModelImpl {
   }
 
   override getObjects(): Object3D[] {
-    const objects = [];
+    const objects: Object3D[] = [];
     this.gltfLoader.originalObjects.forEach((object: Object3D) => {
       objects.push(object);
     });
@@ -78,7 +78,7 @@ export class DynamicModelImpl extends ModelImpl {
 
     const handlesSet = new Set(handles);
 
-    const objects = [];
+    const objects: Object3D[] = [];
     handlesSet.forEach((handle) => {
       objects.push(this.gltfLoader.getObjectsByHandle(handle));
     });
@@ -153,6 +153,13 @@ export class DynamicModelImpl extends ModelImpl {
       return target;
     };
 
+    const calcObjectOffset = (object: Object3D, target: Vector3): Vector3 => {
+      const parent = object.parent;
+      if (!parent || parent.userData.originalCenter === undefined) return target;
+
+      return target.subVectors(object.userData.originalCenter, parent.userData.originalCenter);
+    };
+
     const calcObjectDepth = (object: Object3D): number => {
       if (object.userData.depth !== undefined) return object.userData.depth;
 
@@ -162,17 +169,19 @@ export class DynamicModelImpl extends ModelImpl {
       object.userData.depth = depth;
       object.userData.originalPosition = object.position.clone();
       object.userData.originalCenter = calcObjectCenter(object, new Vector3());
+      object.userData.originalOffset = calcObjectOffset(object, new Vector3());
 
       return depth;
     };
 
     const explodeScale = scale / 100;
     const explodeRoot = this.scene.children[0];
+    const explodeObjects = this.getObjects();
 
-    if (!explodeRoot.userData.explodeDepth) {
+    if (explodeRoot.userData.explodeDepth === undefined) {
       let maxDepth = 0;
 
-      this.gltfLoader.originalObjects.forEach((object: Object3D) => {
+      explodeObjects.forEach((object: Object3D) => {
         const depth = calcObjectDepth(object);
         if (depth > maxDepth) maxDepth = depth;
       });
@@ -187,11 +196,11 @@ export class DynamicModelImpl extends ModelImpl {
 
     const offsetCache = new Map();
 
-    const calcObjectOffset = (object: Object3D, target: Vector3): Vector3 => {
+    const calcExplodeOffset = (object: Object3D, target: Vector3): Vector3 => {
       if (offsetCache.has(object)) return target.copy(offsetCache.get(object));
 
       const parent = object.parent;
-      if (parent && object !== explodeRoot) calcObjectOffset(parent, target);
+      if (parent && object !== explodeRoot) calcExplodeOffset(parent, target);
 
       const depth = object.userData.depth;
 
@@ -199,11 +208,7 @@ export class DynamicModelImpl extends ModelImpl {
         let objectScale = explodeScale * coeff;
         if (depth === explodeDepth) objectScale *= currentSegmentFraction;
 
-        const parentCenter = parent.userData.originalCenter;
-        const objectCenter = object.userData.originalCenter;
-        const localOffset = objectCenter.clone().sub(parentCenter).multiplyScalar(objectScale);
-
-        target.add(localOffset);
+        target.addScaledVector(object.userData.originalOffset, objectScale);
       }
 
       offsetCache.set(object, target.clone());
@@ -213,9 +218,9 @@ export class DynamicModelImpl extends ModelImpl {
 
     const transformMap = new Map();
 
-    this.gltfLoader.originalObjects.forEach((object: Object3D) => {
-      const globalOffset = calcObjectOffset(object, new Vector3());
-      transformMap.set(object, new Matrix4().makeTranslation(globalOffset));
+    explodeObjects.forEach((object: Object3D) => {
+      const offset = calcExplodeOffset(object, new Vector3());
+      transformMap.set(object, new Matrix4().makeTranslation(offset));
     });
 
     this.gltfLoader.applyObjectTransforms(transformMap);

package/src/Viewer/loaders/DynamicGltfLoader/GltfStructure.js

@@ -88,6 +88,8 @@ export class GltfStructure {
     this._nextObjectId = 1;
     this.loadingAborted = false;
     this.criticalError = null;
+    // Holds decoded base64 buffer when the .gltf has an embedded data URI
+    this.embeddedBinaryChunk = null;
   }
 
   async initialize(loader) {
@@ -99,21 +101,53 @@ export class GltfStructure {
 
     this.json = json;
     this.loader = loader;
-    this.uri = this.json.buffers[0].uri || "";
+
+    const bufferUri = this.json.buffers?.[0]?.uri || "";
+
+    // Detect embedded data URI (e.g. "data:application/octet-stream;base64,...")
+    // and decode it once into memory. The buffer URI is then cleared so that
+    // scheduleRequest serves data from memory instead of doing network requests.
+    if (bufferUri.startsWith("data:")) {
+      this.embeddedBinaryChunk = await this._decodeDataUri(bufferUri);
+      this.uri = "";
+    } else {
+      this.uri = bufferUri;
+    }
+  }
+
+  // Decode a data URI to ArrayBuffer using the browser's native fetch() —
+  // much faster than atob() + JS loop for large (10+ MB) base64 buffers.
+  async _decodeDataUri(dataUri) {
+    try {
+      const response = await fetch(dataUri);
+      return await response.arrayBuffer();
+    } catch (e) {
+      throw new Error(`DynamicLoader: Failed to decode embedded data URI: ${e.message}`);
+    }
   }
 
   clear() {
-    this.json = null;
-    this.loadController = null;
-    this.pendingRequests = [];
     if (this.batchTimeout) {
       clearTimeout(this.batchTimeout);
       this.batchTimeout = null;
     }
 
-    this.disposeMaterials();
-    this.textureCache.clear();
-    this.materials.clear();
+    this._rejectPendingRequests();
+
+    if (this.disposeMaterials) {
+      try {
+        this.disposeMaterials();
+      } catch (e) {
+        console.warn("DynamicLoader: error during disposeMaterials in clear():", e);
+      }
+    }
+    if (this.textureCache) this.textureCache.clear();
+    if (this.materials) this.materials.clear();
+
+    this.embeddedBinaryChunk = null;
+    this.json = null;
+    this.loadController = null;
+    this.uri = "";
 
     this.activeChunkLoads = 0;
     this.chunkQueue = [];
@@ -121,11 +155,38 @@ export class GltfStructure {
     this.criticalError = null;
   }
 
+  _rejectPendingRequests() {
+    const pending = this.pendingRequests;
+    this.pendingRequests = [];
+    if (!pending || pending.length === 0) return;
+
+    const cancelError = new Error("DynamicLoader: Structure cleared while requests pending");
+    for (let i = 0; i < pending.length; i++) {
+      const item = pending[i];
+      if (item && typeof item._reject === "function") {
+        try {
+          item._reject(cancelError);
+        } catch {
+          // Consumer may have already been disposed
+        }
+      }
+    }
+  }
+
   getJson() {
     return this.json;
   }
 
   scheduleRequest(request) {
+    // Fast path: buffer was an embedded data URI, decoded once into memory
+    if (this.embeddedBinaryChunk && !this.uri) {
+      return Promise.resolve({
+        buffer: this.embeddedBinaryChunk,
+        relOffset: request.offset,
+        length: request.length,
+      });
+    }
+
     return new Promise((resolve, reject) => {
       if (this.loadingAborted) {
         reject(
@@ -441,8 +502,13 @@ export class GltfStructure {
           return await this.textureLoader.loadAsync(fullUrl);
         } else if (image.bufferView !== undefined) {
           const bufferView = this.json.bufferViews[image.bufferView];
-          const array = await this.getBufferView(bufferView.byteOffset || 0, bufferView.byteLength, 5121);
-          const blob = new Blob([array], { type: image.mimeType });
+          const { buffer, relOffset } = await this.getBufferView(
+            bufferView.byteOffset || 0,
+            bufferView.byteLength,
+            5121
+          );
+          const imageBytes = new Uint8Array(buffer, relOffset, bufferView.byteLength);
+          const blob = new Blob([imageBytes], { type: image.mimeType });
           const url = URL.createObjectURL(blob);
           const texture = await this.textureLoader.loadAsync(url);
           URL.revokeObjectURL(url);
@@ -479,6 +545,7 @@ export class GltfStructure {
         })
       );
     }
+    await this.flushBufferRequests();
     await Promise.all(texturePromises);
   }
 

package/src/Viewer/loaders/GLTFBinaryParser.ts

@@ -86,10 +86,10 @@ export class GLTFBinaryParser {
       offset += chunkLength;
     }
 
-    if (typeof this.content === "undefined") {
+    if (this.content === undefined) {
       throw new Error("GLTFBinaryParser: JSON content not found.");
     }
-    if (typeof this.body === "undefined") {
+    if (this.body === undefined) {
       throw new Error("GLTFBinaryParser: Binary buffer chunk not found or type not supported.");
     }
   }

package/src/Viewer/loaders/GLTFCloudDynamicLoader.ts

@@ -58,9 +58,10 @@ export class GLTFCloudDynamicLoader extends Loader {
     const scene = new Group();
 
     this.gltfLoader = new DynamicGltfLoader(this.viewer.camera, scene, this.viewer.renderer);
-    this.gltfLoader.memoryLimit = this.viewer.options.memoryLimit;
+    this.gltfLoader.setMemoryLimit(this.viewer.options.memoryLimit);
     this.gltfLoader.setVisibleEdges(this.viewer.options.edgeModel);
-    // this.gltfLoader.setMaxConcurrentChunks(this.viewer.options.maxConcurrentChunks);
+    this.gltfLoader.setMaxConcurrentChunks(params.maxConcurrentChunks);
+    this.gltfLoader.setDracoLoader(params.dracoLoader);
 
     const modelImpl = new DynamicModelImpl(scene);
     modelImpl.id = model.file.id;

package/src/Viewer/loaders/GLTFFileDynamicLoader.ts

@@ -49,21 +49,23 @@ export class GLTFFileDynamicLoader extends Loader {
     if (this.manager) this.manager.dispose();
   }
 
-  override isSupport(file: any, format?: string): boolean {
+  override isSupport(file: any, format = ""): boolean {
     return (
       (typeof file === "string" || file instanceof globalThis.File || file instanceof ArrayBuffer) &&
       /(gltf|glb)$/i.test(format)
     );
   }
 
-  override async load(file: any, format?: string, params?: GLTFLoadParams): Promise<this> {
+  override async load(file: any, format?: string, params: GLTFLoadParams = {}): Promise<this> {
     this.manager = new GLTFLoadingManager(file, params);
 
     const scene = new Group();
 
     this.gltfLoader = new DynamicGltfLoader(this.viewer.camera, scene, this.viewer.renderer);
-    this.gltfLoader.memoryLimit = this.viewer.options.memoryLimit;
-    this.gltfLoader.visibleEdges = this.viewer.options.edgeModel;
+    this.gltfLoader.setMemoryLimit(this.viewer.options.memoryLimit);
+    this.gltfLoader.setVisibleEdges(this.viewer.options.edgeModel);
+    this.gltfLoader.setMaxConcurrentChunks(params.maxConcurrentChunks);
+    this.gltfLoader.setDracoLoader(params.dracoLoader);
 
     const modelImpl = new DynamicModelImpl(scene);
     modelImpl.id = params.modelId || this.extractFileName(file);

package/src/Viewer/measurement/Snapper.ts

@@ -32,7 +32,6 @@ import {
   Raycaster,
   Vector2,
   Vector3,
-  WebGLRenderer,
 } from "three";
 
 const DESKTOP_SNAP_DISTANCE = 10;
@@ -47,16 +46,16 @@ const _projection = new Vector3();
 
 export class Snapper {
   public camera: Camera;
-  public renderer: WebGLRenderer;
+  public clippingPlanes: Plane[];
   public canvas: HTMLCanvasElement;
   public threshold: number;
   private raycaster: Raycaster;
   private detectRadiusInPixels: number;
   private edgesCache: WeakMap<any, EdgesGeometry>;
 
-  constructor(camera: Camera, renderer: WebGLRenderer, canvas: HTMLCanvasElement) {
+  constructor(camera: Camera, clippingPlanes: Plane[], canvas: HTMLCanvasElement) {
     this.camera = camera;
-    this.renderer = renderer;
+    this.clippingPlanes = clippingPlanes;
     this.canvas = canvas;
 
     this.threshold = 0.0001;
@@ -109,7 +108,7 @@ export class Snapper {
     let intersects = this.raycaster.intersectObjects(objects, recursive);
 
     if (clip) {
-      const clippingPlanes = this.renderer.clippingPlanes || [];
+      const clippingPlanes = this.clippingPlanes;
       clippingPlanes.forEach((plane: Plane) => {
         intersects = intersects.filter((intersect) => plane.distanceToPoint(intersect.point) >= 0);
       });
@@ -152,7 +151,7 @@ export class Snapper {
     return 0.1;
   }
 
-  getSnapPoint(mouse: Vector2, objects: Object3D[]): Vector3 {
+  getSnapPoint(mouse: Vector2, objects: Object3D[]): Vector3 | undefined {
     const intersections = this.getPointerIntersects(mouse, objects);
     if (intersections.length === 0) return undefined;
 
@@ -167,7 +166,7 @@ export class Snapper {
     const intersectionPoint = intersections[0].point;
     const localPoint = object.worldToLocal(intersectionPoint.clone());
 
-    let snapPoint: Vector3;
+    let snapPoint: Vector3 | undefined = undefined;
     let snapDistance = this.getDetectRadius(intersectionPoint);
 
     const geometry = object.geometry;

package/src/Viewer/models/ModelImpl.ts

@@ -36,6 +36,7 @@ export class ModelImpl implements IModelImpl {
   private originalObjects: Set<Object3D>;
 
   constructor(scene: Object3D) {
+    this.id = "";
     this.scene = scene;
 
     this.handleToObjects = new Map();
@@ -94,8 +95,8 @@ export class ModelImpl implements IModelImpl {
       if (object.material) disposeMaterials(object.material);
     }
 
-    this.handleToObjects = undefined;
-    this.originalObjects = undefined;
+    this.handleToObjects.clear();
+    this.originalObjects.clear();
 
     this.scene.traverse(disposeObject);
     this.scene.clear();
@@ -275,7 +276,30 @@ export class ModelImpl implements IModelImpl {
   }
 
   getExtents(target: Box3): Box3 {
-    this.scene.traverseVisible((object) => target.expandByObject(object));
+    const _box = new Box3();
+
+    function expandByObject(object: any, target: Box3) {
+      if (!object.geometry) return;
+
+      object.updateWorldMatrix(false, false);
+
+      // Use object bounds for the BatchedMesh, InstancedMesh and SkinnedMesh, use geometry
+      // bounds for others. See Box3.expandByObject() for more details.
+
+      if (object.boundingBox !== undefined) {
+        if (object.boundingBox === null) object.computeBoundingBox();
+        _box.copy(object.boundingBox);
+      } else {
+        if (object.geometry.boundingBox === null) object.geometry.computeBoundingBox();
+        _box.copy(object.geometry.boundingBox);
+      }
+
+      _box.applyMatrix4(object.matrixWorld);
+
+      target.union(_box);
+    }
+
+    this.scene.traverseVisible((object) => expandByObject(object, target));
     return target;
   }
 
@@ -284,15 +308,15 @@ export class ModelImpl implements IModelImpl {
   }
 
   getVisibleObjects(): Object3D[] {
-    const objects = [];
-    this.scene.traverseVisible((object) => objects.push(object));
-    return objects.filter((object) => object.userData.handle);
+    const objects: Object3D[] = [];
+    this.scene.traverseVisible((object) => object.userData.handle && objects.push(object));
+    return objects;
   }
 
   getObjectsByHandles(handles: string | string[]): Object3D[] {
     if (!Array.isArray(handles)) handles = [handles];
 
-    const ownHandles = [];
+    const ownHandles: string[] = [];
     handles.forEach((handle) => {
       const index = handle.indexOf(":");
       if (index !== -1) {
@@ -304,7 +328,7 @@ export class ModelImpl implements IModelImpl {
 
     const handlesSet = new Set<string>(ownHandles);
 
-    const objects = [];
+    const objects: Object3D[][] = [];
     handlesSet.forEach((handle) => {
       objects.push(Array.from(this.handleToObjects.get(handle) || []));
     });
@@ -403,25 +427,40 @@ export class ModelImpl implements IModelImpl {
       return target;
     };
 
-    function calcExplodeDepth(object: Object3D, depth: number): number {
-      let result = depth;
+    const calcObjectOffset = (object: Object3D, target: Vector3): Vector3 => {
+      const parent = object.parent;
+      if (!parent || parent.userData.originalCenter === undefined) return target;
 
-      object.children.forEach((x: Object3D) => {
-        const objectDepth = calcExplodeDepth(x, depth + 1);
-        if (result < objectDepth) result = objectDepth;
-      });
+      return target.subVectors(object.userData.originalCenter, parent.userData.originalCenter);
+    };
+
+    const calcObjectDepth = (object: Object3D): number => {
+      if (object.userData.depth !== undefined) return object.userData.depth;
 
+      const parent = object.parent;
+      const depth = parent && object !== explodeRoot ? calcObjectDepth(parent) + 1 : 0;
+
+      object.userData.depth = depth;
       object.userData.originalPosition = object.position.clone();
       object.userData.originalCenter = calcObjectCenter(object, new Vector3());
+      object.userData.originalOffset = calcObjectOffset(object, new Vector3());
 
-      return result;
-    }
+      return depth;
+    };
 
     const explodeScale = scale / 100;
     const explodeRoot = this.scene;
+    const explodeObjects = this.getObjects();
+
+    if (explodeRoot.userData.explodeDepth === undefined) {
+      let maxDepth = 0;
+
+      explodeObjects.forEach((object: Object3D) => {
+        const depth = calcObjectDepth(object);
+        if (depth > maxDepth) maxDepth = depth;
+      });
 
-    if (!explodeRoot.userData.explodeDepth) {
-      explodeRoot.userData.explodeDepth = calcExplodeDepth(explodeRoot, 1);
+      explodeRoot.userData.explodeDepth = maxDepth;
     }
 
     const maxDepth = explodeRoot.userData.explodeDepth;
@@ -429,27 +468,25 @@ export class ModelImpl implements IModelImpl {
     const explodeDepth = 0 | scaledExplodeDepth;
     const currentSegmentFraction = scaledExplodeDepth - explodeDepth;
 
-    function explodeObject(object: any, depth: number) {
+    const explodeObject = (object: any) => {
       if (object.isCamera) return;
-      if (object.userData.isHighlightWireframe) return;
 
       object.position.copy(object.userData.originalPosition);
 
+      const depth = object.userData.depth;
+
       if (depth > 0 && depth <= explodeDepth) {
         let objectScale = explodeScale * coeff;
         if (depth === explodeDepth) objectScale *= currentSegmentFraction;
 
-        const parentCenter = object.parent.userData.originalCenter;
-        const objectCenter = object.userData.originalCenter;
-        const localOffset = objectCenter.clone().sub(parentCenter).multiplyScalar(objectScale);
-
-        object.position.add(localOffset);
+        object.position.addScaledVector(object.userData.originalOffset, objectScale);
       }
+    };
 
-      object.children.forEach((x: Object3D) => explodeObject(x, depth + 1));
-    }
+    explodeObjects.forEach((object: Object3D) => {
+      explodeObject(object);
+    });
 
-    explodeObject(explodeRoot, 0);
     this.scene.updateMatrixWorld();
 
     return this;

package/lib/Viewer/scenes/Helpers.d.ts

@@ -1,7 +0,0 @@
-import { Scene, WebGLRenderer } from "three";
-export declare class Helpers extends Scene {
-    private oldAutoClear;
-    private oldClippingPlanes;
-    onBeforeRender(renderer: WebGLRenderer): void;
-    onAfterRender(renderer: WebGLRenderer): void;
-}