@inweb/viewer-three 26.12.6 → 27.1.0

package/dist/viewer-three.module.js

@@ -805,6 +805,7 @@ class OrbitDragger {
         this.changed = false;
         this.viewer = viewer;
         this.viewer.addEventListener("databasechunk", this.updateControls);
+        this.viewer.addEventListener("clear", this.updateControls);
         this.viewer.on("viewposition", this.updateControls);
         this.viewer.addEventListener("zoom", this.updateControls);
         this.viewer.addEventListener("drawviewpoint", this.updateControls);
@@ -816,6 +817,7 @@ class OrbitDragger {
     initialize() { }
     dispose() {
         this.viewer.removeEventListener("databasechunk", this.updateControls);
+        this.viewer.removeEventListener("clear", this.updateControls);
         this.viewer.off("viewposition", this.updateControls);
         this.viewer.removeEventListener("zoom", this.updateControls);
         this.viewer.removeEventListener("drawviewpoint", this.updateControls);
@@ -913,20 +915,25 @@ class CuttingPlaneZAxisDragger extends CuttingPlaneDragger {
     }
 }
 
+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 },
+};
 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]));
 function convertUnits(fromUnits, toUnits, distance) {
     const fromFactor = 1 / (ModelUnits[fromUnits] || ModelUnits.Default).scale;
     const toFactor = (ModelUnits[toUnits] || ModelUnits.Default).scale || 1;
@@ -934,7 +941,7 @@ function convertUnits(fromUnits, toUnits, distance) {
 }
 
 function getDisplayUnit(units) {
-    return (ModelUnits[units] || ModelUnits.Default).type;
+    return (ModelUnits[units] || ModelUnits.Default).symbol;
 }
 function calculatePrecision(value) {
     const distance = Math.abs(value);
@@ -971,7 +978,7 @@ function formatDistance(distance, units, precision = 2) {
     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;
@@ -994,6 +1001,7 @@ class Snapper {
         this.camera = camera;
         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();
@@ -1014,10 +1022,10 @@ class Snapper {
         this.raycaster.setFromCamera(coords, this.camera);
         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: {},
         };
         let intersects = this.raycaster.intersectObjects(objects, false);
@@ -1186,6 +1194,7 @@ class MeasureLineDragger extends OrbitDragger {
         this.line = new MeasureLine(this.overlay, this.scale, this.units, this.precision);
         this.overlay.addLine(this.line);
         this.snapper = new Snapper(viewer.camera, viewer.renderer, viewer.canvas);
+        this.snapper.threshold = viewer.extents.getSize(new Vector3()).length() / 10000;
         this.objects = [];
         this.updateObjects();
         this.updateUnits();
@@ -2189,7 +2198,7 @@ function zoomTo(viewer, box) {
     const boxCenter = box.getCenter(new Vector3());
     const boxSize = box.getBoundingSphere(new Sphere()).radius;
     const rendererSize = viewer.renderer.getSize(new Vector2());
-    const aspect = rendererSize.x / rendererSize.y;
+    const aspectRatio = rendererSize.x / rendererSize.y;
     const camera = viewer.camera;
     if (camera.isPerspectiveCamera) {
         const offset = new Vector3(0, 0, 1)
@@ -2201,8 +2210,8 @@ function zoomTo(viewer, box) {
     if (camera.isOrthographicCamera) {
         camera.top = boxSize;
         camera.bottom = -boxSize;
-        camera.left = camera.bottom * aspect;
-        camera.right = camera.top * aspect;
+        camera.left = camera.bottom * aspectRatio;
+        camera.right = camera.top * aspectRatio;
         camera.zoom = 1;
         camera.updateProjectionMatrix();
         const offset = new Vector3(0, 0, 1)
@@ -2263,9 +2272,9 @@ function getSelected(viewer) {
 function getSelected2(viewer) {
     const handles2 = [];
     viewer.models.forEach((model) => {
-        handles2.push(...model.getHandlesByObjects(viewer.selected));
+        handles2.push(model.getHandlesByObjects(viewer.selected));
     });
-    return handles2;
+    return handles2.flat();
 }
 
 function hideSelected(viewer) {
@@ -2489,15 +2498,15 @@ class CameraComponent {
     switchCamera(camera) {
         const extentsSize = this.viewer.extents.getBoundingSphere(new Sphere()).radius * 2 || 1;
         const rendererSize = this.viewer.renderer.getSize(new Vector2());
-        const aspect = rendererSize.x / rendererSize.y;
+        const aspectRatio = rendererSize.x / rendererSize.y;
         if (camera.isPerspectiveCamera) {
-            camera.aspect = aspect;
+            camera.aspect = aspectRatio;
             camera.near = extentsSize / 1000;
             camera.far = extentsSize * 1000;
         }
         if (camera.isOrthographicCamera) {
-            camera.left = camera.bottom * aspect;
-            camera.right = camera.top * aspect;
+            camera.left = camera.bottom * aspectRatio;
+            camera.right = camera.top * aspectRatio;
             camera.near = 0;
             camera.far = extentsSize * 1000;
         }
@@ -2545,10 +2554,12 @@ class CameraComponent {
 
 class ExtentsComponent {
     constructor(viewer) {
-        this.syncExtents = () => {
+        this.syncExtents = (event) => {
             const extents = new Box3();
             this.viewer.models.forEach((model) => model.getExtents(extents));
             this.viewer.extents.copy(extents);
+            if (event.type !== "databasechunk" && event.target !== "clear")
+                return;
             if (this.viewer.models.length > 1)
                 return;
             this.viewer.extents.getCenter(this.viewer.target);
@@ -2915,12 +2926,12 @@ class HighlighterComponent {
         const { edgesVisibility } = this.viewer.options;
         if (!Array.isArray(objects))
             objects = [objects];
-        if (!objects.length)
+        if (objects.length === 0)
             return;
         objects
             .filter((object) => !object.userData.isEdge)
             .forEach((object) => {
-            if (object.isHighlighted)
+            if (object.userData.isHighlighted)
                 return;
             if (object.isLine || object.isLineSegments) {
                 const positions = object.geometry.attributes.position.array;
@@ -2929,43 +2940,39 @@ class HighlighterComponent {
                     ? HighlighterUtils.fromIndexedLine(positions, indices)
                     : HighlighterUtils.fromNonIndexedLine(positions, object.isLineSegments);
                 const wireframe = new Wireframe(lineGeometry, this.lineGlowMaterial);
-                wireframe.position.copy(object.position);
-                wireframe.rotation.copy(object.rotation);
-                wireframe.scale.copy(object.scale);
                 wireframe.visible = edgesVisibility;
-                object.parent.add(wireframe);
+                wireframe.userData.isHighlightWireframe = true;
+                object.add(wireframe);
                 object.userData.highlightWireframe = wireframe;
                 object.userData.originalMaterial = object.material;
                 object.material = this.lineMaterial;
-                object.isHighlighted = true;
+                object.userData.isHighlighted = true;
             }
             else if (object.isMesh) {
                 const edgesGeometry = new EdgesGeometry(object.geometry, 89);
                 const lineGeometry = new LineSegmentsGeometry().fromEdgesGeometry(edgesGeometry);
                 const wireframe = new Wireframe(lineGeometry, this.edgesMaterial);
-                wireframe.position.copy(object.position);
-                wireframe.rotation.copy(object.rotation);
-                wireframe.scale.copy(object.scale);
                 wireframe.visible = edgesVisibility;
-                object.parent.add(wireframe);
+                wireframe.userData.isHighlightWireframe = true;
+                object.add(wireframe);
                 object.userData.highlightWireframe = wireframe;
                 object.userData.originalMaterial = object.material;
                 object.material = this.facesMaterial;
-                object.isHighlighted = true;
+                object.userData.isHighlighted = true;
             }
         });
     }
     unhighlight(objects) {
         if (!Array.isArray(objects))
             objects = [objects];
-        if (!objects.length)
+        if (objects.length === 0)
             return;
         objects.forEach((object) => {
-            if (!object.isHighlighted)
+            if (!object.userData.isHighlighted)
                 return;
-            object.isHighlighted = false;
             object.material = object.userData.originalMaterial;
             object.userData.highlightWireframe.removeFromParent();
+            delete object.userData.isHighlighted;
             delete object.userData.originalMaterial;
             delete object.userData.highlightWireframe;
         });
@@ -3013,6 +3020,7 @@ class SelectionComponent {
             if (upPosition.distanceTo(this.downPosition) !== 0)
                 return;
             const snapper = new Snapper(this.viewer.camera, this.viewer.renderer, this.viewer.canvas);
+            snapper.threshold = this.viewer.extents.getSize(new Vector3()).length() / 10000;
             let intersections = [];
             this.viewer.models.forEach((model) => {
                 const objects = model.getVisibleObjects();
@@ -3067,12 +3075,12 @@ class SelectionComponent {
         }
         if (!Array.isArray(objects))
             objects = [objects];
-        if (!objects.length)
+        if (objects.length === 0)
             return;
-        model.showOriginalObjects(objects);
+        model.highlightObjects(objects);
         this.highlighter.highlight(objects);
         objects.forEach((object) => this.viewer.selected.push(object));
-        objects.forEach((object) => (object.isSelected = true));
+        objects.forEach((object) => (object.userData.isSelected = true));
     }
     deselect(objects, model) {
         if (!model) {
@@ -3081,29 +3089,29 @@ class SelectionComponent {
         }
         if (!Array.isArray(objects))
             objects = [objects];
-        if (!objects.length)
+        if (objects.length === 0)
             return;
+        model.unhighlightObjects(objects);
         this.highlighter.unhighlight(objects);
-        model.hideOriginalObjects(objects);
         this.viewer.selected = this.viewer.selected.filter((x) => !objects.includes(x));
-        objects.forEach((object) => (object.isSelected = false));
+        objects.forEach((object) => (object.userData.isSelected = false));
     }
     toggleSelection(objects, model) {
         if (!Array.isArray(objects))
             objects = [objects];
-        if (!objects.length)
+        if (objects.length === 0)
             return;
-        if (objects[0].isSelected)
+        if (objects[0].userData.isSelected)
             this.deselect(objects, model);
         else
             this.select(objects, model);
     }
     clearSelection() {
-        if (!this.viewer.selected.length)
+        if (this.viewer.selected.length === 0)
             return;
+        this.viewer.models.forEach((model) => model.unhighlightObjects(this.viewer.selected));
         this.highlighter.unhighlight(this.viewer.selected);
-        this.viewer.models.forEach((model) => model.hideOriginalObjects(this.viewer.selected));
-        this.viewer.selected.forEach((object) => (object.isSelected = false));
+        this.viewer.selected.forEach((object) => (object.userData.isSelected = false));
         this.viewer.selected.length = 0;
     }
 }
@@ -3265,6 +3273,20 @@ components.registerComponent("ResetComponent", (viewer) => new ResetComponent(vi
 class ModelImpl {
     constructor(scene) {
         this.scene = scene;
+        this.handleToObjects = new Map();
+        this.originalObjects = new Set();
+        this.scene.traverse((object) => {
+            this.originalObjects.add(object);
+            const handle = object.userData.handle;
+            if (!handle)
+                return;
+            let objects = this.handleToObjects.get(handle);
+            if (!objects) {
+                objects = new Set();
+                this.handleToObjects.set(handle, objects);
+            }
+            objects.add(object);
+        });
     }
     dispose() {
         function disposeMaterial(material) {
@@ -3280,6 +3302,8 @@ class ModelImpl {
             if (object.material)
                 disposeMaterials(object.material);
         }
+        this.handleToObjects = undefined;
+        this.originalObjects = undefined;
         this.scene.traverse(disposeObject);
         this.scene.clear();
     }
@@ -3422,67 +3446,56 @@ class ModelImpl {
         return info;
     }
     getExtents(target) {
-        this.scene.traverseVisible((object) => !object.children.length && target.expandByObject(object));
+        this.scene.traverseVisible((object) => target.expandByObject(object));
         return target;
     }
     getObjects() {
-        const objects = [];
-        this.scene.traverse((object) => objects.push(object));
-        return objects;
+        return Array.from(this.originalObjects);
     }
     getVisibleObjects() {
         const objects = [];
         this.scene.traverseVisible((object) => objects.push(object));
-        return objects;
-    }
-    hasObject(object) {
-        while (object) {
-            if (object === this.scene)
-                return true;
-            object = object.parent;
-        }
-        return false;
-    }
-    hasHandle(handle) {
-        return !handle.includes(":") || handle.split(":", 1)[0] === this.id + "";
+        return objects.filter((object) => object.userData.handle);
     }
-    getOwnObjects(objects) {
-        if (!Array.isArray(objects))
-            objects = [objects];
-        return objects.filter((object) => this.hasObject(object));
-    }
-    getOwnHandles(handles) {
+    getObjectsByHandles(handles) {
         if (!Array.isArray(handles))
             handles = [handles];
-        return handles.filter((handle) => this.hasHandle(handle));
-    }
-    getObjectsByHandles(handles) {
-        const ownHandles = this.getOwnHandles(handles);
-        if (ownHandles.length === 0)
-            return [];
-        const handleSet = new Set(ownHandles.map((handle) => handle.slice(handle.indexOf(":") + 1)));
+        const ownHandles = [];
+        handles.forEach((handle) => {
+            const index = handle.indexOf(":");
+            if (index !== -1) {
+                if (handle.slice(0, index) !== this.id)
+                    return;
+                handle = handle.slice(index + 1);
+            }
+            ownHandles.push(handle);
+        });
+        const handlesSet = new Set(ownHandles);
         const objects = [];
-        this.scene.traverse((object) => {
-            const handle = object.userData.handle;
-            if (handle && handleSet.has(handle))
-                objects.push(object);
+        handlesSet.forEach((handle) => {
+            objects.push(Array.from(this.handleToObjects.get(handle) || []));
         });
-        return objects;
+        return objects.flat();
     }
     getHandlesByObjects(objects) {
-        const ownObjects = this.getOwnObjects(objects);
-        if (ownObjects.length === 0)
-            return [];
+        if (!Array.isArray(objects))
+            objects = [objects];
         const handleSet = new Set();
-        ownObjects.forEach((object) => {
-            const handle = object.userData.handle;
-            if (handle)
-                handleSet.add(`${this.id}:${handle}`);
+        objects
+            .filter((object) => this.originalObjects.has(object))
+            .forEach((object) => {
+            handleSet.add(`${this.id}:${object.userData.handle}`);
         });
         return Array.from(handleSet);
     }
     hideObjects(objects) {
-        this.getOwnObjects(objects).forEach((object) => (object.visible = false));
+        if (!Array.isArray(objects))
+            objects = [objects];
+        objects
+            .filter((object) => this.originalObjects.has(object))
+            .forEach((object) => {
+            object.visible = false;
+        });
         return this;
     }
     hideAllObjects() {
@@ -3492,12 +3505,20 @@ class ModelImpl {
         if (!Array.isArray(objects))
             objects = [objects];
         const visibleSet = new Set(objects);
-        this.getOwnObjects(objects).forEach((object) => object.traverseAncestors((parent) => visibleSet.add(parent)));
+        objects
+            .filter((object) => this.originalObjects.has(object))
+            .forEach((object) => {
+            object.traverseAncestors((parent) => visibleSet.add(parent));
+        });
         this.scene.traverse((object) => (object.visible = visibleSet.has(object)));
         return this;
     }
     showObjects(objects) {
-        this.getOwnObjects(objects).forEach((object) => {
+        if (!Array.isArray(objects))
+            objects = [objects];
+        objects
+            .filter((object) => this.originalObjects.has(object))
+            .forEach((object) => {
             object.visible = true;
             object.traverseAncestors((parent) => (parent.visible = true));
         });
@@ -3507,36 +3528,55 @@ class ModelImpl {
         this.scene.traverse((object) => (object.visible = true));
         return this;
     }
-    showOriginalObjects(objects) {
+    highlightObjects(objects) {
         return this;
     }
-    hideOriginalObjects(objects) {
+    unhighlightObjects(objects) {
         return this;
     }
     explode(scale = 0, coeff = 4) {
+        const centers = new Map();
+        const getObjectCenter = (object, target) => {
+            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) => extents.expandByObject(x));
+            extents.getCenter(target);
+            centers.set(handle, target.clone());
+            return target;
+        };
         function calcExplodeDepth(object, depth) {
-            let res = depth;
+            let result = depth;
             object.children.forEach((x) => {
                 const objectDepth = calcExplodeDepth(x, depth + 1);
-                if (res < objectDepth)
-                    res = objectDepth;
+                if (result < objectDepth)
+                    result = objectDepth;
             });
             object.userData.originalPosition = object.position.clone();
-            object.userData.originalCenter = new Box3().setFromObject(object).getCenter(new Vector3());
-            object.userData.isExplodeLocked = depth > 2 && object.children.length === 0;
-            return res;
-        }
-        scale /= 100;
-        if (!this.scene.userData.explodeDepth)
-            this.scene.userData.explodeDepth = calcExplodeDepth(this.scene, 1);
-        const maxDepth = this.scene.userData.explodeDepth;
-        const scaledExplodeDepth = scale * maxDepth + 1;
+            object.userData.originalCenter = getObjectCenter(object, new Vector3());
+            return result;
+        }
+        const explodeScale = scale / 100;
+        const explodeRoot = this.scene;
+        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;
         function explodeObject(object, depth) {
+            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 = scale * coeff;
+            if (depth > 0 && depth <= explodeDepth) {
+                let objectScale = explodeScale * coeff;
                 if (depth === explodeDepth)
                     objectScale *= currentSegmentFraction;
                 const parentCenter = object.parent.userData.originalCenter;
@@ -3546,7 +3586,7 @@ class ModelImpl {
             }
             object.children.forEach((x) => explodeObject(x, depth + 1));
         }
-        explodeObject(this.scene, 0);
+        explodeObject(explodeRoot, 0);
         this.scene.updateMatrixWorld();
         return this;
     }
@@ -3584,29 +3624,24 @@ class DynamicModelImpl extends ModelImpl {
     getVisibleObjects() {
         return this.gltfLoader.getOriginalObjectForSelect();
     }
-    hasObject(object) {
-        return this.gltfLoader.originalObjects.has(object);
-    }
     getObjectsByHandles(handles) {
-        const ownHandles = this.getOwnHandles(handles);
-        if (ownHandles.length === 0)
-            return [];
-        const handlesSet = new Set(ownHandles);
+        if (!Array.isArray(handles))
+            handles = [handles];
+        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();
     }
     getHandlesByObjects(objects) {
-        const ownObjects = this.getOwnObjects(objects);
-        if (ownObjects.length === 0)
-            return [];
+        if (!Array.isArray(objects))
+            objects = [objects];
         const handleSet = new Set();
-        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);
     }
@@ -3629,14 +3664,78 @@ class DynamicModelImpl extends ModelImpl {
         this.gltfLoader.showAllHiddenObjects();
         return this;
     }
-    showOriginalObjects(objects) {
+    highlightObjects(objects) {
         this.gltfLoader.showOriginalObjects(objects);
         return this;
     }
-    hideOriginalObjects(objects) {
+    unhighlightObjects(objects) {
         this.gltfLoader.hideOriginalObjects(objects);
         return this;
     }
+    explode(scale = 0, coeff = 4) {
+        const centers = new Map();
+        const calcObjectCenter = (object, target) => {
+            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) => extents.expandByObject(x));
+            extents.getCenter(target);
+            centers.set(handle, target.clone());
+            return target;
+        };
+        function calcExplodeDepth(object, depth) {
+            let result = depth;
+            object.children
+                .filter((x) => !x.userData.isOptimized)
+                .forEach((x) => {
+                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) {
+            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) => !x.userData.isOptimized)
+                .forEach((x) => explodeObject(x, depth + 1));
+        }
+        explodeObject(explodeRoot, 0);
+        this.scene.updateMatrixWorld();
+        this.gltfLoader.applyObjectTransforms(transformMap);
+        return this;
+    }
 }
 
 const GL_COMPONENT_TYPES = {
@@ -3685,7 +3784,7 @@ class GltfStructure {
     this.textureCache = new Map();
     this.materialCache = new Map();
     this.uri = "";
-    this._nextObjectId = 0;
+    this._nextObjectId = 1;
     this.loadingAborted = false;
     this.criticalError = null;
   }
@@ -4186,8 +4285,6 @@ class DynamicGltfLoader {
     this.frameDelay = 0;
     this.graphicsObjectLimit = 10000;
     this.totalLoadedObjects = 0;
-    this.lastUpdateTime = 0;
-    this.updateInterval = 1000;
     this.handleToObjects = new Map();
     this.originalObjects = new Set();
     this.originalObjectsToSelection = new Set();
@@ -4204,6 +4301,8 @@ class DynamicGltfLoader {
     this.hiddenHandles = new Set();
     this.newOptimizedObjects = new Set();
     this.oldOptimizeObjects = new Set();
+    this.objectTransforms = new Map();
+    this.transformedGeometries = new Map();
     this.activeChunkLoads = 0;
     this.chunkQueue = [];
     this.objectIdToIndex = new Map();
@@ -4861,11 +4960,7 @@ class DynamicGltfLoader {
           loaded: loadedCount,
           total: totalNodes,
         });
-        const currentTime = Date.now();
-        if (currentTime - this.lastUpdateTime >= this.updateInterval) {
-          this.dispatchEvent("update");
-          this.lastUpdateTime = currentTime;
-        }
+        this.dispatchEvent("update");
         await new Promise((resolve) => {
           setTimeout(resolve, 0);
         });
@@ -4965,14 +5060,32 @@ class DynamicGltfLoader {
       if (!node.geometryExtents) continue;
       if (node.object && 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);
+      const structureRoot = node.structure ? this.structureRoots.get(node.structure.id) : null;
+      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);
+      }
+      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;
   }
   loadCamera(structure, cameraIndex, nodeDef) {
@@ -5048,7 +5161,6 @@ class DynamicGltfLoader {
       for (let i = 0; i < this.maxObjectId; i++) {
         this.objectVisibility[i] = 1.0;
       }
-      console.log(`Initialized object visibility array: ${this.maxObjectId} objects`);
     }
   }
   createVisibilityMaterial(material) {
@@ -5185,8 +5297,9 @@ class DynamicGltfLoader {
     this.newOptimizedObjects.clear();
     this.oldOptimizeObjects.clear();
     this.isolatedObjects = [];
+    this.objectTransforms.clear();
+    this.transformedGeometries.clear();
     this.totalLoadedObjects = 0;
-    this.lastUpdateTime = 0;
     this.currentMemoryUsage = 0;
     this.loadedGeometrySize = 0;
     this.abortController = new AbortController();
@@ -5297,9 +5410,7 @@ class DynamicGltfLoader {
   }
   yieldToUI() {
     return new Promise((resolve) => {
-      requestAnimationFrame(() => {
-        setTimeout(resolve, 0);
-      });
+      setTimeout(resolve, 0);
     });
   }
   async optimizeScene() {
@@ -5882,6 +5993,171 @@ class DynamicGltfLoader {
       mergedObject.geometry.attributes.visibility.needsUpdate = true;
     }
   }
+  applyObjectTransforms(objectTransformMap) {
+    if (this.mergedObjectMap.size === 0) {
+      console.warn("No merged objects to transform");
+      return;
+    }
+    this.objectTransforms = new Map(objectTransformMap);
+    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();
+    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) {
+      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++) {
+          normals[i] = originalNormals[i];
+        }
+        continue;
+      }
+      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;
+        tempVector.set(originalNormals[idx], originalNormals[idx + 1], originalNormals[idx + 2]);
+        tempVector.applyMatrix4(normalMatrix).normalize();
+        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;
+    const originalPositions = this.transformedGeometries.get(mergedObject.uuid);
+    if (originalPositions) {
+      const positions = geometry.attributes.position.array;
+      positions.set(originalPositions);
+      geometry.attributes.position.needsUpdate = true;
+    }
+    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");
@@ -5913,19 +6189,33 @@ 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;
   }
   setMaxConcurrentChunks(maxChunks) {
@@ -6475,6 +6765,7 @@ class Viewer extends EventEmitter2 {
         this.target = new Vector3(0, 0, 0);
         this._activeDragger = null;
         this._components = [];
+        this._updateDelay = 1000;
         this._renderNeeded = false;
         this._renderTime = 0;
         this.render = this.render.bind(this);
@@ -6498,8 +6789,8 @@ class Viewer extends EventEmitter2 {
         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.001, 1000);
+        const aspectRatio = width / height;
+        this.camera = new PerspectiveCamera(45, aspectRatio, 0.001, 1000);
         this.camera.up.set(0, 1, 0);
         this.camera.position.set(0, 0, 1);
         this.camera.lookAt(this.target);
@@ -6596,14 +6887,14 @@ class Viewer extends EventEmitter2 {
         if (!this.renderer)
             return;
         const camera = this.camera;
-        const aspect = width / height;
+        const aspectRatio = width / height;
         if (camera.isPerspectiveCamera) {
-            camera.aspect = aspect;
+            camera.aspect = aspectRatio;
             camera.updateProjectionMatrix();
         }
         if (camera.isOrthographicCamera) {
-            camera.left = camera.bottom * aspect;
-            camera.right = camera.top * aspect;
+            camera.left = camera.bottom * aspectRatio;
+            camera.right = camera.top * aspectRatio;
             camera.updateProjectionMatrix();
         }
         this.renderer.setSize(width, height, updateStyle);
@@ -6612,16 +6903,18 @@ class Viewer extends EventEmitter2 {
         this.emitEvent({ type: "resize", width, height });
     }
     update(force = false) {
+        const time = performance.now();
+        force = force || time - this._renderTime >= this._updateDelay;
         this._renderNeeded = true;
         if (force)
-            this.render();
-        this.emitEvent({ type: "update", data: force });
+            this.render(time);
+        this.emitEvent({ type: "update", force });
     }
-    render(time, force = false) {
+    render(time) {
         var _a, _b;
         if (!this.renderer)
             return;
-        if (!this._renderNeeded && !force)
+        if (!this._renderNeeded)
             return;
         if (!time)
             time = performance.now();
@@ -6830,12 +7123,12 @@ class Viewer extends EventEmitter2 {
             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;
+                const aspectRatio = rendererSize.x / rendererSize.y;
                 const camera = new OrthographicCamera();
                 camera.top = orthogonal_camera.field_height / 2;
                 camera.bottom = -orthogonal_camera.field_height / 2;
-                camera.left = camera.bottom * aspect;
-                camera.right = camera.top * aspect;
+                camera.left = camera.bottom * aspectRatio;
+                camera.right = camera.top * aspectRatio;
                 camera.near = 0;
                 camera.far = extentsSize * 1000;
                 camera.zoom = orthogonal_camera.view_to_world_scale;
@@ -6848,6 +7141,7 @@ class Viewer extends EventEmitter2 {
                 this.renderPass.camera = camera;
                 this.helpersPass.camera = camera;
                 this.ssaaRenderPass.camera = camera;
+                this.options.cameraMode = "orthographic";
                 this.emitEvent({ type: "changecameramode", mode: "orthographic" });
             }
         };
@@ -6855,10 +7149,10 @@ class Viewer extends EventEmitter2 {
             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;
+                const aspectRatio = rendererSize.x / rendererSize.y;
                 const camera = new PerspectiveCamera();
                 camera.fov = perspective_camera.field_of_view;
-                camera.aspect = aspect;
+                camera.aspect = aspectRatio;
                 camera.near = extentsSize / 1000;
                 camera.far = extentsSize * 1000;
                 camera.updateProjectionMatrix();
@@ -6870,6 +7164,7 @@ class Viewer extends EventEmitter2 {
                 this.renderPass.camera = camera;
                 this.helpersPass.camera = camera;
                 this.ssaaRenderPass.camera = camera;
+                this.options.cameraMode = "perspective";
                 this.emitEvent({ type: "changecameramode", mode: "perspective" });
             }
         };
@@ -6899,6 +7194,7 @@ class Viewer extends EventEmitter2 {
         setSelection(((_b = viewpoint.custom_fields) === null || _b === void 0 ? void 0 : _b.selection2) || viewpoint.selection);
         this._markup.setViewpoint(viewpoint);
         this.target.copy(getVector3FromPoint3d((_d = (_c = viewpoint.custom_fields) === null || _c === void 0 ? void 0 : _c.camera_target) !== null && _d !== void 0 ? _d : this.target));
+        this.syncOverlay();
         this.setActiveDragger(draggerName);
         this.emitEvent({ type: "drawviewpoint", data: viewpoint });
         this.update();