@inweb/viewer-three 26.12.5 → 26.12.7

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

@@ -102,6 +102,10 @@ export class DynamicGltfLoader {
     this.newOptimizedObjects = new Set();
     this.oldOptimizeObjects = new Set();
 
+    // Transform system for exploded view - works directly with original objects
+    this.objectTransforms = new Map(); // originalObject -> Matrix4
+    this.transformedGeometries = new Map(); // mergedObject.uuid -> original position data
+
     this.activeChunkLoads = 0;
     this.chunkQueue = [];
 
@@ -311,7 +315,6 @@ export class DynamicGltfLoader {
     const uniqueTextureIds = new Set();
     if (Array.isArray(this.structures)) {
       for (const structure of this.structures) {
-        // console.log(structure.materialCache.values());
         try {
           for (const entry of structure.materialCache.values()) {
             if (entry?.mesh?.uuid) uniqueMaterialIds.add(entry.mesh.uuid);
@@ -1006,17 +1009,40 @@ export class DynamicGltfLoader {
       if (node.object && this.hiddenHandles.has(node.object.userData.handle)) continue;
 
       const transformedBox = node.geometryExtents.clone();
+      const structureRoot = node.structure ? this.structureRoots.get(node.structure.id) : null;
+
+      if (node.group) {
+        const matrices = [];
+        let currentGroup = node.group;
 
-      if (node.group && node.group.matrix) {
-        transformedBox.applyMatrix4(node.group.matrix);
+        while (currentGroup && currentGroup !== structureRoot) {
+          if (currentGroup.matrix && currentGroup.matrixAutoUpdate === false) {
+            matrices.unshift(currentGroup.matrix);
+          }
+          currentGroup = currentGroup.parent;
+        }
 
-        if (node.group.parent && node.group.parent.matrix) {
-          transformedBox.applyMatrix4(node.group.parent.matrix);
+        for (const matrix of matrices) {
+          transformedBox.applyMatrix4(matrix);
         }
       }
+
+      if (structureRoot && structureRoot.matrix) {
+        transformedBox.applyMatrix4(structureRoot.matrix);
+      }
+
+      const transform = this.objectTransforms.get(node.object);
+      if (transform) {
+        transformedBox.applyMatrix4(transform);
+      }
+
       totalExtent.union(transformedBox);
     }
 
+    if (this.scene && this.scene.matrix && !totalExtent.isEmpty()) {
+      totalExtent.applyMatrix4(this.scene.matrix);
+    }
+
     return totalExtent;
   }
 
@@ -1101,7 +1127,6 @@ export class DynamicGltfLoader {
       for (let i = 0; i < this.maxObjectId; i++) {
         this.objectVisibility[i] = 1.0;
       }
-      console.log(`Initialized object visibility array: ${this.maxObjectId} objects`);
     }
   }
 
@@ -1255,6 +1280,9 @@ export class DynamicGltfLoader {
     this.oldOptimizeObjects.clear();
     this.isolatedObjects = [];
 
+    this.objectTransforms.clear();
+    this.transformedGeometries.clear();
+
     this.totalLoadedObjects = 0;
     this.lastUpdateTime = 0;
     this.currentMemoryUsage = 0;
@@ -2114,6 +2142,231 @@ export class DynamicGltfLoader {
     }
   }
 
+  applyObjectTransforms(objectTransformMap) {
+    if (this.mergedObjectMap.size === 0) {
+      console.warn("No merged objects to transform");
+      return;
+    }
+
+    // Store transform map directly
+    this.objectTransforms = new Map(objectTransformMap);
+
+    // Apply transforms to all merged meshes
+    for (const mesh of this.mergedMesh) {
+      this._applyTransformToMergedObject(mesh);
+    }
+    for (const line of this.mergedLines) {
+      this._applyTransformToMergedObject(line);
+    }
+    for (const lineSegment of this.mergedLineSegments) {
+      this._applyTransformToMergedObject(lineSegment);
+    }
+    for (const point of this.mergedPoints) {
+      this._applyTransformToMergedObject(point);
+    }
+  }
+
+  createExplodeTransforms(objects = null, explodeCenter = null, explodeFactor = 1.5) {
+    const transformMap = new Map();
+
+    if (!explodeCenter) {
+      explodeCenter = new Vector3();
+      const extent = this.getTotalGeometryExtent();
+      if (!extent.isEmpty()) {
+        extent.getCenter(explodeCenter);
+      }
+    }
+
+    const objectsArray = objects
+      ? Array.isArray(objects)
+        ? objects
+        : Array.from(objects)
+      : Array.from(this.originalObjects);
+
+    for (const obj of objectsArray) {
+      if (!obj.geometry || !obj.geometry.attributes.position) continue;
+
+      const boundingBox = new Box3().setFromBufferAttribute(obj.geometry.attributes.position);
+
+      if (obj.matrixWorld) {
+        boundingBox.applyMatrix4(obj.matrixWorld);
+      }
+
+      if (boundingBox.isEmpty()) continue;
+
+      const objectCenter = new Vector3();
+      boundingBox.getCenter(objectCenter);
+
+      const direction = objectCenter.clone().sub(explodeCenter);
+      const distance = direction.length();
+
+      if (distance > 0) {
+        direction.normalize();
+        const offset = direction.multiplyScalar(distance * (explodeFactor - 1.0));
+
+        const matrix = new Matrix4().makeTranslation(offset.x, offset.y, offset.z);
+        transformMap.set(obj, matrix);
+      }
+    }
+
+    return transformMap;
+  }
+
+  clearTransforms() {
+    this.objectTransforms.clear();
+
+    for (const mesh of this.mergedMesh) {
+      this._restoreOriginalGeometry(mesh);
+    }
+    for (const line of this.mergedLines) {
+      this._restoreOriginalGeometry(line);
+    }
+    for (const lineSegment of this.mergedLineSegments) {
+      this._restoreOriginalGeometry(lineSegment);
+    }
+    for (const point of this.mergedPoints) {
+      this._restoreOriginalGeometry(point);
+    }
+  }
+
+  clearHandleTransforms() {
+    this.clearTransforms();
+  }
+
+  _applyTransformToMergedObject(mergedObject) {
+    const objectData = this.mergedObjectMap.get(mergedObject.uuid);
+    if (!objectData || !objectData.objectMapping) return;
+
+    const geometry = mergedObject.geometry;
+    if (!geometry || !geometry.attributes.position) return;
+
+    const positionAttr = geometry.attributes.position;
+    const positions = positionAttr.array;
+
+    if (!this.transformedGeometries.has(mergedObject.uuid)) {
+      this.transformedGeometries.set(mergedObject.uuid, new Float32Array(positions));
+    }
+
+    const originalPositions = this.transformedGeometries.get(mergedObject.uuid);
+    const tempVector = new Vector3();
+
+    for (const [originalMesh, mappingData] of objectData.objectMapping) {
+      const transform = this.objectTransforms.get(originalMesh);
+
+      if (!transform) {
+        const startIdx = mappingData.startVertexIndex * 3;
+        const endIdx = (mappingData.startVertexIndex + mappingData.vertexCount) * 3;
+        for (let i = startIdx; i < endIdx; i++) {
+          positions[i] = originalPositions[i];
+        }
+        continue;
+      }
+
+      const startVertex = mappingData.startVertexIndex;
+      const vertexCount = mappingData.vertexCount;
+
+      for (let i = 0; i < vertexCount; i++) {
+        const idx = (startVertex + i) * 3;
+
+        tempVector.set(originalPositions[idx], originalPositions[idx + 1], originalPositions[idx + 2]);
+
+        tempVector.applyMatrix4(transform);
+
+        positions[idx] = tempVector.x;
+        positions[idx + 1] = tempVector.y;
+        positions[idx + 2] = tempVector.z;
+      }
+    }
+
+    if (geometry.attributes.normal) {
+      this._updateNormalsForTransform(geometry, objectData, originalPositions);
+    }
+
+    positionAttr.needsUpdate = true;
+    geometry.computeBoundingSphere();
+    geometry.computeBoundingBox();
+  }
+
+  _updateNormalsForTransform(geometry, objectData, originalPositions) {
+    const normalAttr = geometry.attributes.normal;
+    if (!normalAttr) return;
+
+    const normals = normalAttr.array;
+    const tempVector = new Vector3();
+    const normalMatrix = new Matrix4();
+
+    // Store original normals if not already stored
+    const normalsKey = `${geometry.uuid}_normals`;
+    if (!this.transformedGeometries.has(normalsKey)) {
+      this.transformedGeometries.set(normalsKey, new Float32Array(normals));
+    }
+
+    const originalNormals = this.transformedGeometries.get(normalsKey);
+
+    for (const [originalMesh, mappingData] of objectData.objectMapping) {
+      // Direct lookup by object reference - NO HANDLE LOOKUP!
+      const transform = this.objectTransforms.get(originalMesh);
+
+      if (!transform) {
+        // Restore original normals
+        const startIdx = mappingData.startVertexIndex * 3;
+        const endIdx = (mappingData.startVertexIndex + mappingData.vertexCount) * 3;
+        for (let i = startIdx; i < endIdx; i++) {
+          normals[i] = originalNormals[i];
+        }
+        continue;
+      }
+
+      // Create normal matrix (inverse transpose of transform)
+      normalMatrix.copy(transform).invert().transpose();
+
+      const startVertex = mappingData.startVertexIndex;
+      const vertexCount = mappingData.vertexCount;
+
+      for (let i = 0; i < vertexCount; i++) {
+        const idx = (startVertex + i) * 3;
+
+        // Get original normal
+        tempVector.set(originalNormals[idx], originalNormals[idx + 1], originalNormals[idx + 2]);
+
+        // Apply normal transformation
+        tempVector.applyMatrix4(normalMatrix).normalize();
+
+        // Write back transformed normal
+        normals[idx] = tempVector.x;
+        normals[idx + 1] = tempVector.y;
+        normals[idx + 2] = tempVector.z;
+      }
+    }
+
+    normalAttr.needsUpdate = true;
+  }
+
+  _restoreOriginalGeometry(mergedObject) {
+    const geometry = mergedObject.geometry;
+    if (!geometry || !geometry.attributes.position) return;
+
+    // Restore original positions
+    const originalPositions = this.transformedGeometries.get(mergedObject.uuid);
+    if (originalPositions) {
+      const positions = geometry.attributes.position.array;
+      positions.set(originalPositions);
+      geometry.attributes.position.needsUpdate = true;
+    }
+
+    // Restore original normals
+    const normalsKey = `${geometry.uuid}_normals`;
+    const originalNormals = this.transformedGeometries.get(normalsKey);
+    if (originalNormals && geometry.attributes.normal) {
+      const normals = geometry.attributes.normal.array;
+      normals.set(originalNormals);
+      geometry.attributes.normal.needsUpdate = true;
+    }
+
+    geometry.computeBoundingSphere();
+    geometry.computeBoundingBox();
+  }
+
   syncHiddenObjects() {
     if (this.mergedObjectMap.size === 0) {
       console.log("No merged objects to sync");
@@ -2149,19 +2402,41 @@ export class DynamicGltfLoader {
 
   getStructureGeometryExtent(structureId) {
     const extent = new Box3();
+    const structureRoot = this.structureRoots.get(structureId);
+
     for (const [nodeId, node] of this.nodes.entries()) {
       if (!node.geometryExtents) continue;
       if (!nodeId.startsWith(structureId + "_")) continue;
       if (node.object && this.hiddenHandles && this.hiddenHandles.has(node.object.userData.handle)) continue;
       const transformedBox = node.geometryExtents.clone();
-      if (node.group && node.group.matrix) {
-        transformedBox.applyMatrix4(node.group.matrix);
-        if (node.group.parent && node.group.parent.matrix) {
-          transformedBox.applyMatrix4(node.group.parent.matrix);
+
+      if (node.group) {
+        const matrices = [];
+        let currentGroup = node.group;
+
+        while (currentGroup && currentGroup !== structureRoot) {
+          if (currentGroup.matrix && currentGroup.matrixAutoUpdate === false) {
+            matrices.unshift(currentGroup.matrix);
+          }
+          currentGroup = currentGroup.parent;
+        }
+
+        for (const matrix of matrices) {
+          transformedBox.applyMatrix4(matrix);
         }
       }
+
+      if (structureRoot && structureRoot.matrix) {
+        transformedBox.applyMatrix4(structureRoot.matrix);
+      }
+
       extent.union(transformedBox);
     }
+
+    if (this.scene && this.scene.matrix && !extent.isEmpty()) {
+      extent.applyMatrix4(this.scene.matrix);
+    }
+
     return extent;
   }
 

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

@@ -21,7 +21,7 @@
 // acknowledge and accept the above terms.
 ///////////////////////////////////////////////////////////////////////////////
 
-import { Box3, Object3D } from "three";
+import { Box3, Matrix4, Object3D, Vector3 } from "three";
 import { IInfo, Info } from "@inweb/viewer-core";
 
 import { ModelImpl } from "../../models/ModelImpl";
@@ -72,33 +72,28 @@ export class DynamicModelImpl extends ModelImpl {
     return this.gltfLoader.getOriginalObjectForSelect();
   }
 
-  override hasObject(object: any): boolean {
-    return this.gltfLoader.originalObjects.has(object);
-  }
-
   override getObjectsByHandles(handles: string | string[]): Object3D[] {
-    const ownHandles = this.getOwnHandles(handles);
-    if (ownHandles.length === 0) return [];
+    if (!Array.isArray(handles)) handles = [handles];
 
-    const handlesSet = new Set(ownHandles);
+    const handlesSet = new Set(handles);
 
     const objects = [];
     handlesSet.forEach((handle) => {
-      objects.push(...this.gltfLoader.getObjectsByHandle(handle));
+      objects.push(this.gltfLoader.getObjectsByHandle(handle));
     });
 
-    return objects;
+    return objects.flat();
   }
 
   override getHandlesByObjects(objects: Object3D | Object3D[]): string[] {
-    const ownObjects = this.getOwnObjects(objects);
-    if (ownObjects.length === 0) return [];
+    if (!Array.isArray(objects)) objects = [objects];
 
     const handleSet = new Set<string>();
-    ownObjects.forEach((object) => {
-      const handle = object.userData.handle;
-      if (handle) handleSet.add(handle);
-    });
+    objects
+      .filter((object) => this.gltfLoader.originalObjects.has(object))
+      .forEach((object) => {
+        handleSet.add(object.userData.handle);
+      });
 
     return Array.from(handleSet);
   }
@@ -126,13 +121,94 @@ export class DynamicModelImpl extends ModelImpl {
     return this;
   }
 
-  override showOriginalObjects(objects: Object3D | Object3D[]): this {
+  override highlightObjects(objects: Object3D | Object3D[]): this {
     this.gltfLoader.showOriginalObjects(objects);
     return this;
   }
 
-  override hideOriginalObjects(objects: Object3D | Object3D[]): this {
+  override unhighlightObjects(objects: Object3D | Object3D[]): this {
     this.gltfLoader.hideOriginalObjects(objects);
     return this;
   }
+
+  override explode(scale = 0, coeff = 4): this {
+    const centers = new Map();
+
+    const calcObjectCenter = (object: Object3D, target: Vector3): Vector3 => {
+      const extents = new Box3().setFromObject(object);
+
+      const handle = object.userData.handle;
+      if (!handle) return extents.getCenter(target);
+
+      const center = centers.get(handle);
+      if (center) return target.copy(center);
+
+      const objects = this.getObjectsByHandles(handle);
+      objects.forEach((x: Object3D) => extents.expandByObject(x));
+      extents.getCenter(target);
+
+      centers.set(handle, target.clone());
+
+      return target;
+    };
+
+    function calcExplodeDepth(object: Object3D, depth: number): number {
+      let result = depth;
+      object.children
+        .filter((x: Object3D) => !x.userData.isOptimized)
+        .forEach((x: Object3D) => {
+          const objectDepth = calcExplodeDepth(x, depth + 1);
+          if (result < objectDepth) result = objectDepth;
+        });
+
+      object.userData.originalPosition = object.position.clone();
+      object.userData.originalCenter = calcObjectCenter(object, new Vector3());
+
+      return result;
+    }
+
+    const explodeScale = scale / 100;
+    const explodeRoot = this.scene.children[0];
+
+    if (!explodeRoot.userData.explodeDepth) explodeRoot.userData.explodeDepth = calcExplodeDepth(explodeRoot, 1);
+    const maxDepth = explodeRoot.userData.explodeDepth;
+
+    const scaledExplodeDepth = explodeScale * maxDepth + 1;
+    const explodeDepth = 0 | scaledExplodeDepth;
+    const currentSegmentFraction = scaledExplodeDepth - explodeDepth;
+
+    const transformMap = new Map();
+
+    function explodeObject(object, depth: number) {
+      if (object.isCamera) return;
+      if (object.userData.isHighlightWireframe) return;
+
+      object.position.copy(object.userData.originalPosition);
+
+      if (depth > 0 && depth <= explodeDepth && !object.userData.isExplodeLocked) {
+        let objectScale = explodeScale * coeff;
+        if (depth === explodeDepth) objectScale *= currentSegmentFraction;
+
+        const parentCenter = object.parent.userData.originalCenter;
+        const objectCenter = object.userData.originalCenter;
+        const objectOffset = objectCenter.clone().sub(parentCenter).multiplyScalar(objectScale);
+
+        object.position.add(objectOffset);
+
+        const matrix = new Matrix4().makeTranslation(objectOffset.x, objectOffset.y, objectOffset.z);
+        transformMap.set(object, matrix);
+      }
+
+      object.children
+        .filter((x: Object3D) => !x.userData.isOptimized)
+        .forEach((x: Object3D) => explodeObject(x, depth + 1));
+    }
+
+    explodeObject(explodeRoot, 0);
+    this.scene.updateMatrixWorld();
+
+    this.gltfLoader.applyObjectTransforms(transformMap);
+
+    return this;
+  }
 }

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

@@ -58,7 +58,7 @@ export class GltfStructure {
     this.textureCache = new Map();
     this.materialCache = new Map();
     this.uri = "";
-    this._nextObjectId = 0;
+    this._nextObjectId = 1;
     this.loadingAborted = false;
     this.criticalError = null;
   }

package/src/Viewer/measurement/Snapper.ts

@@ -49,6 +49,7 @@ export class Snapper {
   public camera: Camera;
   public renderer: WebGLRenderer;
   public canvas: HTMLCanvasElement;
+  public threshold: number;
   private raycaster: Raycaster;
   private detectRadiusInPixels: number;
   private edgesCache: WeakMap<any, EdgesGeometry>;
@@ -58,6 +59,8 @@ export class Snapper {
     this.renderer = renderer;
     this.canvas = canvas;
 
+    this.threshold = 0.0001;
+
     this.raycaster = new Raycaster();
     this.detectRadiusInPixels = this.isMobile() ? MOBILE_SNAP_DISTANCE : DESKTOP_SNAP_DISTANCE;
     this.edgesCache = new WeakMap();
@@ -91,10 +94,10 @@ export class Snapper {
 
     this.raycaster.params = {
       Mesh: {},
-      Line: { threshold: 0.05 },
-      Line2: { threshold: 0.05 },
+      Line: { threshold: this.threshold },
+      Line2: { threshold: this.threshold },
       LOD: {},
-      Points: { threshold: 0.01 },
+      Points: { threshold: this.threshold },
       Sprite: {},
     };
 

package/src/Viewer/measurement/UnitConverter.ts

@@ -23,21 +23,28 @@
 
 // Model units for the user to choose from.
 
+export const DisplayUnits = {
+  Meters: { name: "Meters", symbol: "m", scale: 1.0 },
+  Centimeters: { name: "Centimeters", symbol: "cm", scale: 0.01 },
+  Millimeters: { name: "Millimeters", symbol: "mm", scale: 0.001 },
+  Feet: { name: "Feet", symbol: "ft", scale: 0.3048 },
+  Inches: { name: "Inches", symbol: "in", scale: 0.0254 },
+  Yards: { name: "Yards", symbol: "yd", scale: 0.9144 },
+  Kilometers: { name: "Kilometers", symbol: "km", scale: 1000.0 },
+  Miles: { name: "Miles", symbol: "mi", scale: 1609.344 },
+  Micrometers: { name: "Micrometers", symbol: "µm", scale: 0.000001 },
+  Mils: { name: "Mils", symbol: "mil", scale: 0.0000254 },
+  MicroInches: { name: "Micro-inches", symbol: "µin", scale: 0.0000000254 },
+  Default: { name: "File units", symbol: "", scale: 1.0 },
+};
+
 export const ModelUnits = {
-  Meters: { name: "Meters", type: "m", scale: 1.0 },
-  Centimeters: { name: "Centimeters", type: "cm", scale: 0.01 },
-  Millimeters: { name: "Millimeters", type: "mm", scale: 0.001 },
-  Feet: { name: "Feet", type: "ft", scale: 0.3048 },
-  Inches: { name: "Inches", type: "in", scale: 0.0254 },
-  Yards: { name: "Yards", type: "yd", scale: 0.9144 },
-  Kilometers: { name: "Kilometers", type: "km", scale: 1000.0 },
-  Miles: { name: "Miles", type: "mi", scale: 1609.344 },
-  Micrometers: { name: "Micrometers", type: "µm", scale: 0.000001 },
-  Mils: { name: "Mils", type: "mil", scale: 0.0000254 },
-  MicroInches: { name: "Micro-inches", type: "µin", scale: 0.0000000254 },
-  Default: { name: "File units", type: "unit", scale: 1.0 },
+  Default: { name: "", symbol: "", scale: 1.0 },
 };
 
+Object.keys(DisplayUnits).forEach((key) => (ModelUnits[key] = DisplayUnits[key]));
+Object.keys(DisplayUnits).forEach((key) => (ModelUnits[DisplayUnits[key].symbol] = DisplayUnits[key]));
+
 // Convert distance from unit to unit.
 
 export function convertUnits(fromUnits: string, toUnits: string, distance: number) {

package/src/Viewer/measurement/UnitFormatter.ts

@@ -26,7 +26,7 @@ import { ModelUnits } from "./UnitConverter";
 // Returns a standard string representation of the display unit.
 
 export function getDisplayUnit(units: string) {
-  return (ModelUnits[units] || ModelUnits.Default).type;
+  return (ModelUnits[units] || ModelUnits.Default).symbol;
 }
 
 // ===================== AI-CODE-START ======================
@@ -86,7 +86,7 @@ export function formatDistance(distance: number, units: string, precision: any =
   else if (digits > 10) digits = 10;
 
   if (ModelUnits[units]) {
-    return formatNumber(distance, digits, precision) + " " + ModelUnits[units].type;
+    return formatNumber(distance, digits, precision) + " " + ModelUnits[units].symbol;
   } else if (units) {
     return formatNumber(distance, digits, precision) + " " + units;
   } else {

package/src/Viewer/models/IModelImpl.ts

@@ -46,14 +46,6 @@ export interface IModelImpl extends IModel {
 
   getVisibleObjects(): Object3D[];
 
-  hasObject(object: Object3D): boolean;
-
-  hasHandle(handle: string): boolean;
-
-  getOwnObjects(objects: Object3D | Object3D[]): Object3D[];
-
-  getOwnHandles(handles: string | string[]): string[];
-
   getObjectsByHandles(handles: string | string[]): Object3D[];
 
   getHandlesByObjects(objects: Object3D | Object3D[]): string[];
@@ -68,9 +60,9 @@ export interface IModelImpl extends IModel {
 
   showAllObjects(): this;
 
-  showOriginalObjects(objects: Object3D | Object3D[]): this;
+  highlightObjects(objects: Object3D | Object3D[]): this;
 
-  hideOriginalObjects(objects: Object3D | Object3D[]): this;
+  unhighlightObjects(objects: Object3D | Object3D[]): this;
 
   explode(scale: number, coeff?: number): this;
 }