@inweb/viewer-three 26.7.2 → 26.8.0

package/dist/viewer-three.js

@@ -59894,6 +59894,7 @@ void main() {
         selection.clearSelection();
         viewer.models.forEach((model) => {
             const objects = model.getObjectsByHandles(handles);
+            model.showObjects(objects);
             selection.select(objects, model);
         });
         viewer.update();
@@ -60074,9 +60075,9 @@ void main() {
     commands.registerCommand("clearMarkup", clearMarkup);
     commands.registerCommand("clearSelected", clearSelected);
     commands.registerCommand("clearSlices", clearSlices);
+    commands.registerCommand("collect", collect);
     commands.registerCommand("createPreview", createPreview);
     commands.registerCommand("explode", explode);
-    commands.registerCommand("collect", collect);
     commands.registerCommand("getDefaultViewPositions", getDefaultViewPositions);
     commands.registerCommand("getModels", getModels);
     commands.registerCommand("getSelected", getSelected);
@@ -60197,7 +60198,6 @@ void main() {
                 });
                 if (sceneCamera) {
                     this.viewer.camera = sceneCamera.clone();
-                    this.viewer.camera.up.set(0, 0, 1);
                     this.viewer.camera.scale.set(1, 1, 1); // <- Visualize fix
                 }
                 const camera = this.viewer.camera;
@@ -60310,30 +60310,29 @@ void main() {
                 const extentsCenter = this.viewer.extents.getCenter(new Vector3());
                 const extentsSize = this.viewer.extents.getBoundingSphere(new Sphere()).radius;
                 this.directionalLight.position
-                    .set(0.5, 0, 0.866)
+                    .set(0.5, 0.866, 0) // ~60º
                     .multiplyScalar(extentsSize * 2)
                     .add(extentsCenter);
                 this.directionalLight.target.position.copy(extentsCenter);
-                this.frontLight.position.set(0, extentsSize * 2, 0).add(extentsCenter);
+                this.frontLight.position
+                    .set(0, 0, 1)
+                    .multiplyScalar(extentsSize * 2)
+                    .add(extentsCenter);
                 this.frontLight.target.position.copy(extentsCenter);
-                this.hemisphereLight.position.set(0, extentsSize * 3, 0).add(extentsCenter);
+                this.hemisphereLight.position
+                    .set(0, 0, 1)
+                    .multiplyScalar(extentsSize * 3)
+                    .add(extentsCenter);
                 this.viewer.scene.add(this.ambientLight);
                 this.viewer.scene.add(this.directionalLight);
                 this.viewer.scene.add(this.frontLight);
                 this.viewer.scene.add(this.hemisphereLight);
             };
             this.viewer = viewer;
-            this.ambientLight = new AmbientLight(0xffffff, 1);
-            this.viewer.scene.add(this.ambientLight);
-            this.directionalLight = new DirectionalLight(0xffffff, 1);
-            this.directionalLight.position.set(0.5, 0, 0.866); // ~60º
-            this.viewer.scene.add(this.directionalLight);
+            this.ambientLight = new AmbientLight(0xffffff, 1.0);
+            this.directionalLight = new DirectionalLight(0xffffff, 1.0);
             this.frontLight = new DirectionalLight(0xffffff, 1.25);
-            this.frontLight.position.set(0, 1, 0);
-            this.viewer.scene.add(this.frontLight);
             this.hemisphereLight = new HemisphereLight(0xffffff, 0x444444, 1.25);
-            this.hemisphereLight.position.set(0, 0, 1);
-            this.viewer.scene.add(this.hemisphereLight);
             this.viewer.addEventListener("databasechunk", this.geometryEnd);
             this.viewer.addEventListener("clear", this.geometryEnd);
         }
@@ -61431,19 +61430,25 @@ void main() {
     class HighlighterComponent {
         constructor(viewer) {
             this.geometryEnd = () => {
-                const { facesColor, facesTransparancy, edgesColor } = this.viewer.options;
-                this.highlightMaterial = new MeshBasicMaterial({
+                const { facesColor, facesTransparancy, edgesColor, edgesOverlap, facesOverlap } = this.viewer.options;
+                this.highlightMaterial = new MeshPhongMaterial({
                     color: new Color(facesColor.r / 255, facesColor.g / 255, facesColor.b / 255),
                     transparent: true,
                     opacity: (255 - facesTransparancy) / 255,
-                    depthTest: false,
-                    depthWrite: false,
+                    depthTest: !facesOverlap,
+                    depthWrite: !facesOverlap,
+                    specular: 0x222222,
+                    shininess: 10,
+                    reflectivity: 0.05,
+                    polygonOffset: true,
+                    polygonOffsetFactor: 1,
+                    polygonOffsetUnits: 1,
                 });
                 this.outlineMaterial = new LineMaterial({
                     color: new Color(edgesColor.r / 255, edgesColor.g / 255, edgesColor.b / 255),
                     linewidth: 1.5,
-                    depthTest: false,
-                    depthWrite: false,
+                    depthTest: !edgesOverlap,
+                    depthWrite: !edgesOverlap,
                     resolution: new Vector2(window.innerWidth, window.innerHeight),
                 });
                 this.highlightLineMaterial = new LineBasicMaterial({
@@ -61456,18 +61461,27 @@ void main() {
                     linewidth: 5,
                     transparent: true,
                     opacity: 0.8,
-                    depthTest: true,
-                    depthWrite: true,
+                    depthTest: !edgesOverlap,
+                    depthWrite: !edgesOverlap,
                     resolution: new Vector2(window.innerWidth, window.innerHeight),
                 });
             };
             this.optionsChange = () => {
-                const { facesColor, facesTransparancy, edgesColor } = this.viewer.options;
+                const { facesColor, facesTransparancy, edgesColor, edgesVisibility, edgesOverlap, facesOverlap } = this.viewer.options;
                 this.highlightMaterial.color.setRGB(facesColor.r / 255, facesColor.g / 255, facesColor.b / 255);
                 this.highlightMaterial.opacity = (255 - facesTransparancy) / 255;
+                this.highlightMaterial.depthTest = !facesOverlap;
+                this.highlightMaterial.depthWrite = !facesOverlap;
                 this.outlineMaterial.color.setRGB(edgesColor.r / 255, edgesColor.g / 255, edgesColor.b / 255);
+                this.outlineMaterial.depthTest = !edgesOverlap;
+                this.outlineMaterial.depthWrite = !edgesOverlap;
                 this.highlightLineMaterial.color.setRGB(facesColor.r / 255, facesColor.g / 255, facesColor.b / 255);
                 this.highlightLineGlowMaterial.color.setRGB(facesColor.r / 255, facesColor.g / 255, facesColor.b / 255);
+                this.viewer.selected.forEach((selected) => {
+                    const wireframe = selected.userData.highlightWireframe;
+                    if (wireframe)
+                        wireframe.visible = edgesVisibility;
+                });
                 this.viewer.update();
             };
             this.viewer = viewer;
@@ -61492,6 +61506,7 @@ void main() {
             this.viewer.removeEventListener("resize", this.viewerResize);
         }
         highlight(objects) {
+            const { edgesVisibility } = this.viewer.options;
             if (!Array.isArray(objects))
                 objects = [objects];
             if (!objects.length)
@@ -61509,21 +61524,23 @@ void main() {
                     wireframe.position.copy(object.position);
                     wireframe.rotation.copy(object.rotation);
                     wireframe.scale.copy(object.scale);
+                    wireframe.visible = edgesVisibility;
                     object.parent.add(wireframe);
-                    object.userData.highlightwireframe = wireframe;
+                    object.userData.highlightWireframe = wireframe;
                     object.userData.originalMaterial = object.material;
                     object.material = this.highlightLineMaterial;
                     object.isHighlighted = true;
                 }
                 else if (object.isMesh) {
-                    const edgesGeometry = new EdgesGeometry(object.geometry, 30);
+                    const edgesGeometry = new EdgesGeometry(object.geometry, 60);
                     const lineGeometry = new LineSegmentsGeometry().fromEdgesGeometry(edgesGeometry);
                     const wireframe = new Wireframe(lineGeometry, this.outlineMaterial);
                     wireframe.position.copy(object.position);
                     wireframe.rotation.copy(object.rotation);
                     wireframe.scale.copy(object.scale);
+                    wireframe.visible = edgesVisibility;
                     object.parent.add(wireframe);
-                    object.userData.highlightwireframe = wireframe;
+                    object.userData.highlightWireframe = wireframe;
                     object.userData.originalMaterial = object.material;
                     object.material = this.highlightMaterial;
                     object.isHighlighted = true;
@@ -61540,9 +61557,9 @@ void main() {
                     return;
                 object.isHighlighted = false;
                 object.material = object.userData.originalMaterial;
-                object.userData.highlightwireframe.removeFromParent();
+                object.userData.highlightWireframe.removeFromParent();
                 delete object.userData.originalMaterial;
-                delete object.userData.highlightwireframe;
+                delete object.userData.highlightWireframe;
             });
         }
         viewerResize(event) {
@@ -61591,7 +61608,8 @@ void main() {
                 this.viewer.models.forEach((model) => {
                     const objects = model.getVisibleObjects();
                     const intersects = this.getPointerIntersects(upPosition, objects);
-                    intersections.push(...intersects.map((x) => ({ ...x, model })));
+                    if (intersects.length > 0)
+                        intersections.push({ ...intersects[0], model });
                 });
                 intersections = intersections.sort((a, b) => a.distance - b.distance);
                 if (!event.shiftKey)
@@ -61658,7 +61676,6 @@ void main() {
                 objects = [objects];
             if (!objects.length)
                 return;
-            model.showObjects(objects);
             model.showOriginalObjects(objects);
             this.highlighter.highlight(objects);
             objects.forEach((object) => this.viewer.selected.push(object));
@@ -67314,10 +67331,8 @@ void main() {
             return objects;
         }
         hideObjects(objects) {
-            this.getOwnObjects(objects)
-                .map((object) => object.userData.handle)
-                .forEach((handle) => this.gltfLoader.hiddenHandles.add(handle));
-            this.gltfLoader.syncHiddenObjects();
+            const handles = this.getHandlesByObjects(objects);
+            this.gltfLoader.hideObjects(handles);
             return this;
         }
         isolateObjects(objects) {
@@ -67326,23 +67341,20 @@ void main() {
             return this;
         }
         showObjects(objects) {
-            this.getOwnObjects(objects)
-                .map((object) => object.userData.handle)
-                .forEach((handle) => this.gltfLoader.hiddenHandles.delete(handle));
-            this.gltfLoader.syncHiddenObjects();
+            const handles = this.getHandlesByObjects(objects);
+            this.gltfLoader.showObjects(handles);
             return this;
         }
         showAllObjects() {
-            this.gltfLoader.hiddenHandles.clear();
-            this.gltfLoader.syncHiddenObjects();
+            this.gltfLoader.showAllHiddenObjects();
             return this;
         }
         showOriginalObjects(objects) {
-            this.getOwnObjects(objects).forEach((object) => (object.visible = true));
+            this.gltfLoader.showOriginalObjects(objects);
             return this;
         }
         hideOriginalObjects(objects) {
-            this.getOwnObjects(objects).forEach((object) => (object.visible = false));
+            this.gltfLoader.hideOriginalObjects(objects);
             return this;
         }
     }
@@ -67365,24 +67377,20 @@ void main() {
       TRIANGLE_STRIP: 5,
       TRIANGLE_FAN: 6};
 
+    const MAX_GAP = 128 * 1024; // 128 KB
+    const MAX_CHUNK = 30 * 1024 * 1024; // 100 MB
+
     class GltfStructure {
       constructor(id) {
         this.id = `${id}`;
         this.json = null;
         this.baseUrl = "";
-
-        // Binary manager properties
         this.loadController = null;
-        // Request batching parameters
         this.batchDelay = 10;
         this.maxBatchSize = 5 * 1024 * 1024;
         this.maxRangesPerRequest = 512;
-
-        // Request queue
         this.pendingRequests = [];
         this.batchTimeout = null;
-
-        // Material and texture properties
         this.textureLoader = new TextureLoader();
         this.materials = new Map();
         this.textureCache = new Map();
@@ -67414,57 +67422,110 @@ void main() {
         return this.json;
       }
 
-      // Schedule a request for processing
       scheduleRequest(request) {
-        this.pendingRequests.push(request);
-
-        // Clear existing timeout
-        if (this.batchTimeout) {
-          clearTimeout(this.batchTimeout);
-        }
-
-        // Set new timeout for batch processing
-        this.batchTimeout = setTimeout(() => this.processBatch(), this.batchDelay);
-
-        // Return a promise that will resolve when the data is available
         return new Promise((resolve, reject) => {
-          request.resolve = resolve;
-          request.reject = reject;
+          this.pendingRequests.push({
+            ...request,
+            _resolve: resolve,
+            _reject: reject,
+          });
         });
       }
 
-      async processBatch() {
-        if (this.pendingRequests.length === 0) return;
-
-        // Take current batch of requests and clear timeout
-        const currentBatch = [...this.pendingRequests];
+      async flushBufferRequests() {
+        if (!this.pendingRequests || this.pendingRequests.length === 0) return;
+        const requests = [...this.pendingRequests];
         this.pendingRequests = [];
 
-        if (this.batchTimeout) {
-          clearTimeout(this.batchTimeout);
-          this.batchTimeout = null;
+        requests.sort((a, b) => a.offset - b.offset);
+        const mergedRanges = [];
+        let current = {
+          start: requests[0].offset,
+          end: requests[0].offset + requests[0].length,
+          requests: [requests[0]],
+        };
+        for (let i = 1; i < requests.length; i++) {
+          const req = requests[i];
+          const gap = req.offset - current.end;
+          const newEnd = Math.max(current.end, req.offset + req.length);
+          const projectedSize = newEnd - current.start;
+          if (gap <= MAX_GAP && projectedSize <= MAX_CHUNK) {
+            current.end = newEnd;
+            current.requests.push(req);
+          } else {
+            mergedRanges.push(current);
+            current = {
+              start: req.offset,
+              end: req.offset + req.length,
+              requests: [req],
+            };
+          }
         }
-        try {
-          // Split requests into smaller groups
-          for (let i = 0; i < currentBatch.length; i += this.maxRangesPerRequest) {
-            const batchRequests = currentBatch.slice(i, i + this.maxRangesPerRequest);
-            const buffer = await this.loadController.loadBinaryData(batchRequests);
-
-            let currentOffset = 0;
-            batchRequests.forEach((request) => {
-              const view = this.createTypedArray(buffer, currentOffset, request.length, request.componentType);
-              request.resolve(view);
-              currentOffset += request.length;
+        mergedRanges.push(current);
+        const finalRanges = [];
+        for (const range of mergedRanges) {
+          let { start, end, requests } = range;
+          while (end - start > MAX_CHUNK) {
+            let splitIdx = 0;
+            for (let i = 0; i < requests.length; i++) {
+              if (requests[i].offset + requests[i].length - start > MAX_CHUNK) {
+                break;
+              }
+              splitIdx = i;
+            }
+            const chunkRequests = requests.slice(0, splitIdx + 1);
+            const chunkEnd =
+              chunkRequests[chunkRequests.length - 1].offset + chunkRequests[chunkRequests.length - 1].length;
+            finalRanges.push({
+              start,
+              end: chunkEnd,
+              requests: chunkRequests,
             });
+            requests = requests.slice(splitIdx + 1);
+            if (requests.length > 0) {
+              start = requests[0].offset;
+              end = requests[0].offset + requests[0].length;
+              for (let i = 1; i < requests.length; i++) {
+                end = Math.max(end, requests[i].offset + requests[i].length);
+              }
+            }
+          }
+          if (requests.length > 0) {
+            finalRanges.push({ start, end, requests });
           }
-        } catch (error) {
-          console.error("Error processing batch:", error);
-          currentBatch.forEach((request) => request.reject(error));
         }
-
-        if (this.pendingRequests.length > 0) {
-          this.batchTimeout = setTimeout(() => this.processBatch(), this.batchDelay);
+        /*
+        for (const range of finalRanges) {
+          const length = range.end - range.start;
+          const buffer = await this.loadController.loadBinaryData([
+            { offset: range.start, length: length }
+          ]);
+          for (const req of range.requests) {
+            const relOffset = req.offset - range.start;
+            try {
+              req._resolve({ buffer, relOffset, length: req.length });
+            } catch (e) {
+              req._reject(e);
+            }
+          }
         }
+        */
+
+        const promises = finalRanges.map(async (range) => {
+          const length = range.end - range.start;
+          const buffer = await this.loadController.loadBinaryData([{ offset: range.start, length }]);
+          for (const req of range.requests) {
+            const relOffset = req.offset - range.start;
+            try {
+              req._resolve({ buffer, relOffset, length: req.length });
+            } catch (e) {
+              req._reject(e);
+            }
+          }
+        });
+        await Promise.all(promises);
+
+        this.pendingRequests = [];
       }
 
       getBufferView(byteOffset, byteLength, componentType) {
@@ -67477,12 +67538,10 @@ void main() {
 
       createTypedArray(buffer, offset, length, componentType) {
         try {
-          // Validate parameters
           if (!buffer || !(buffer instanceof ArrayBuffer)) {
             throw new Error("Invalid buffer");
           }
 
-          // Calculate element size for given type
           let elementSize;
           switch (componentType) {
             case 5120:
@@ -67501,18 +67560,15 @@ void main() {
               throw new Error(`Unsupported component type: ${componentType}`);
           }
 
-          // Check if requested length is correct
           const numElements = length / elementSize;
           if (!Number.isInteger(numElements)) {
             throw new Error(`Invalid length ${length} for component type ${componentType}`);
           }
 
-          // Check if buffer is large enough
           if (length > buffer.byteLength) {
             throw new Error(`Buffer too small: need ${length} bytes, but buffer is ${buffer.byteLength} bytes`);
           }
 
-          // Create appropriate typed array
           const ArrayType = GL_COMPONENT_TYPES[componentType];
           return new ArrayType(buffer, offset, numElements);
         } catch (error) {
@@ -67609,7 +67665,6 @@ void main() {
           const image = this.json.images[imageIndex];
 
           if (image.uri) {
-            // Handle base64 or URL
             if (image.uri.startsWith("data:")) {
               return await this.textureLoader.loadAsync(image.uri);
             } else {
@@ -67617,23 +67672,17 @@ void main() {
               return await this.textureLoader.loadAsync(fullUrl);
             }
           } else if (image.bufferView !== undefined) {
-            // Handle embedded binary data
             const bufferView = this.json.bufferViews[image.bufferView];
-            const array = await this.getBufferView(
-              bufferView.byteOffset || 0,
-              bufferView.byteLength,
-              5121 // UNSIGNED_BYTE
-            );
+            const array = await this.getBufferView(bufferView.byteOffset || 0, bufferView.byteLength, 5121);
             const blob = new Blob([array], { type: image.mimeType });
             const url = URL.createObjectURL(blob);
             const texture = await this.textureLoader.loadAsync(url);
             URL.revokeObjectURL(url);
-            texture.flipY = false; // GLTF standard
+            texture.flipY = false;
             return texture;
           }
         };
 
-        // Load all textures
         const texturePromises = [];
         for (let i = 0; i < this.json.textures.length; i++) {
           texturePromises.push(
@@ -67643,82 +67692,56 @@ void main() {
         await Promise.all(texturePromises);
       }
 
-      loadMaterials() {
+      async loadMaterials() {
         if (!this.json.materials) return this.materials;
 
         for (let i = 0; i < this.json.materials.length; i++) {
           const materialDef = this.json.materials[i];
-          const material = this.createMaterial(materialDef);
+          const material = await this.createMaterial(materialDef);
+          material.name = materialDef.name;
           this.materials.set(i, material);
         }
         return this.materials;
       }
 
       createMaterial(materialDef) {
-        const material = new MeshStandardMaterial();
+        const params = {};
 
-        // Base color
         if (materialDef.pbrMetallicRoughness) {
           const pbr = materialDef.pbrMetallicRoughness;
-
           if (pbr.baseColorFactor) {
-            material.color.fromArray(pbr.baseColorFactor);
-            material.opacity = pbr.baseColorFactor[3];
+            params.color = new Color().fromArray(pbr.baseColorFactor);
+            params.opacity = pbr.baseColorFactor[3];
+            if (params.opacity < 1.0) params.transparent = true;
           }
-
           if (pbr.baseColorTexture) {
-            material.map = this.textureCache.get(pbr.baseColorTexture.index);
-          }
-
-          // Metallic and roughness
-          if (pbr.metallicFactor !== undefined) {
-            material.metalness = pbr.metallicFactor;
-          }
-          if (pbr.roughnessFactor !== undefined) {
-            material.roughness = pbr.roughnessFactor;
-          }
-          if (pbr.metallicRoughnessTexture) {
-            material.metalnessMap = this.textureCache.get(pbr.metallicRoughnessTexture.index);
-            material.roughnessMap = material.metalnessMap;
+            params.map = this.textureCache.get(pbr.baseColorTexture.index);
           }
         }
 
-        // Normal map
-        if (materialDef.normalTexture) {
-          material.normalMap = this.textureCache.get(materialDef.normalTexture.index);
-          if (materialDef.normalTexture.scale !== undefined) {
-            material.normalScale.set(materialDef.normalTexture.scale, materialDef.normalTexture.scale);
-          }
-        }
+        params.specular = 0x222222;
+        params.shininess = 10;
+        params.reflectivity = 0.05;
+        params.polygonOffset = true;
+        params.polygonOffsetFactor = 1;
+        params.polygonOffsetUnits = 1;
 
-        // Emissive
         if (materialDef.emissiveFactor) {
-          material.emissive.fromArray(materialDef.emissiveFactor);
-        }
-        if (materialDef.emissiveTexture) {
-          material.emissiveMap = this.textureCache.get(materialDef.emissiveTexture.index);
+          params.emissive = new Color().fromArray(materialDef.emissiveFactor);
         }
 
-        // Occlusion
-        if (materialDef.occlusionTexture) {
-          material.aoMap = this.textureCache.get(materialDef.occlusionTexture.index);
-          if (materialDef.occlusionTexture.strength !== undefined) {
-            material.aoMapIntensity = materialDef.occlusionTexture.strength;
-          }
+        if (materialDef.normalTexture) {
+          params.normalMap = this.textureCache.get(materialDef.normalTexture.index);
         }
 
-        // Alpha mode
         if (materialDef.alphaMode === "BLEND") {
-          material.transparent = true;
-        } else if (materialDef.alphaMode === "MASK") {
-          material.alphaTest = materialDef.alphaCutoff !== undefined ? materialDef.alphaCutoff : 0.5;
+          params.transparent = true;
         }
 
-        // Double sided
-        material.side = materialDef.doubleSided ? DoubleSide : FrontSide;
-
-        material.name = materialDef.name;
-
+        if (materialDef.doubleSided) {
+          params.side = DoubleSide;
+        }
+        const material = new MeshPhongMaterial(params);
         return material;
       }
 
@@ -67751,12 +67774,8 @@ void main() {
         if (!meshDef || !meshDef.primitives) return 0;
 
         let totalSize = 0;
-
-        // Estimate size for each primitive
         for (const primitive of meshDef.primitives) {
-          // Check for attributes
           if (primitive.attributes) {
-            // Calculate attributes size
             for (const [, accessorIndex] of Object.entries(primitive.attributes)) {
               if (accessorIndex === undefined) continue;
 
@@ -67769,7 +67788,6 @@ void main() {
             }
           }
 
-          // Calculate indices size if present
           if (primitive.indices !== undefined) {
             const accessor = this.json.accessors[primitive.indices];
             if (accessor) {
@@ -67842,7 +67860,9 @@ void main() {
         this.mergedPoints = new Set();
 
         this.isolatedObjects = [];
-        this.useVAO = !!window.WebGL2RenderingContext && this.renderer.getContext() instanceof WebGL2RenderingContext;
+        //!!window.WebGL2RenderingContext && this.renderer.getContext() instanceof WebGL2RenderingContext
+        this.useVAO = false;
+        this.visibleEdges = true;
 
         this.handleToOptimizedObjects = new Map();
 
@@ -67851,6 +67871,10 @@ void main() {
         this.oldOptimizeObjects = new Set();
       }
 
+      setVisibleEdges(visible) {
+        this.visibleEdges = visible;
+      }
+
       getAvailableMemory() {
         let memoryLimit = 6 * 1024 * 1024 * 1024;
         try {
@@ -67871,7 +67895,7 @@ void main() {
           console.warn("Error detecting available memory:", error);
         }
 
-        return memoryLimit;
+        return memoryLimit / 3;
       }
 
       getAbortController() {
@@ -67976,7 +68000,7 @@ void main() {
         console.log(`Final memory usage: ${Math.round(currentMemoryUsage / (1024 * 1024))}MB`);
       }
 
-      async loadNode(nodeId) {
+      async loadNode(nodeId, onLoadFinishCb) {
         const node = this.nodes.get(nodeId);
         if (!node || node.loaded || node.loading) return;
 
@@ -67984,38 +68008,138 @@ void main() {
         const meshDef = node.structure.getJson().meshes[node.meshIndex];
 
         try {
-          for (const primitive of meshDef.primitives) {
-            const positionAccessor = primitive.attributes.POSITION;
-            const geometry = new BufferGeometry();
-            const attributes = new Map();
-
-            attributes.set("position", node.structure.createBufferAttribute(positionAccessor));
+          const bufferRequests = [];
+          const primitiveReqMap = new Map();
+          for (let primIdx = 0; primIdx < meshDef.primitives.length; primIdx++) {
+            const primitive = meshDef.primitives[primIdx];
+            const reqs = [];
+
+            if (primitive.attributes.POSITION !== undefined) {
+              const accessorIndex = primitive.attributes.POSITION;
+              const accessor = node.structure.json.accessors[accessorIndex];
+              const bufferView = node.structure.json.bufferViews[accessor.bufferView];
+              const byteOffset = (bufferView.byteOffset || 0) + (accessor.byteOffset || 0);
+              const components = node.structure.getNumComponents(accessor.type);
+              const count = accessor.count;
+              const byteLength = count * components * node.structure.getComponentSize(accessor.componentType);
+              reqs.push({
+                offset: byteOffset,
+                length: byteLength,
+                componentType: accessor.componentType,
+                accessorIndex,
+                type: "position",
+                primIdx,
+              });
+            }
 
             if (primitive.attributes.NORMAL !== undefined) {
-              attributes.set("normal", node.structure.createBufferAttribute(primitive.attributes.NORMAL));
+              const accessorIndex = primitive.attributes.NORMAL;
+              const accessor = node.structure.json.accessors[accessorIndex];
+              const bufferView = node.structure.json.bufferViews[accessor.bufferView];
+              const byteOffset = (bufferView.byteOffset || 0) + (accessor.byteOffset || 0);
+              const components = node.structure.getNumComponents(accessor.type);
+              const count = accessor.count;
+              const byteLength = count * components * node.structure.getComponentSize(accessor.componentType);
+              reqs.push({
+                offset: byteOffset,
+                length: byteLength,
+                componentType: accessor.componentType,
+                accessorIndex,
+                type: "normal",
+                primIdx,
+              });
             }
 
             if (primitive.attributes.TEXCOORD_0 !== undefined) {
-              attributes.set("uv", node.structure.createBufferAttribute(primitive.attributes.TEXCOORD_0));
+              const accessorIndex = primitive.attributes.TEXCOORD_0;
+              const accessor = node.structure.json.accessors[accessorIndex];
+              const bufferView = node.structure.json.bufferViews[accessor.bufferView];
+              const byteOffset = (bufferView.byteOffset || 0) + (accessor.byteOffset || 0);
+              const components = node.structure.getNumComponents(accessor.type);
+              const count = accessor.count;
+              const byteLength = count * components * node.structure.getComponentSize(accessor.componentType);
+              reqs.push({
+                offset: byteOffset,
+                length: byteLength,
+                componentType: accessor.componentType,
+                accessorIndex,
+                type: "uv",
+                primIdx,
+              });
+            }
+
+            if (primitive.indices !== undefined) {
+              const accessorIndex = primitive.indices;
+              const accessor = node.structure.json.accessors[accessorIndex];
+              const bufferView = node.structure.json.bufferViews[accessor.bufferView];
+              const byteOffset = (bufferView.byteOffset || 0) + (accessor.byteOffset || 0);
+              const components = node.structure.getNumComponents(accessor.type);
+              const count = accessor.count;
+              const byteLength = count * components * node.structure.getComponentSize(accessor.componentType);
+              reqs.push({
+                offset: byteOffset,
+                length: byteLength,
+                componentType: accessor.componentType,
+                accessorIndex,
+                type: "index",
+                primIdx,
+              });
             }
+            primitiveReqMap.set(primIdx, reqs);
+            bufferRequests.push(...reqs);
+          }
 
-            const loadedAttributes = await Promise.all(
-              [...attributes.entries()].map(async ([name, promise]) => {
-                const attribute = await promise;
-                return [name, attribute];
-              })
-            );
+          if (bufferRequests.length === 0) {
+            node.loaded = true;
+            node.loading = false;
+            return;
+          }
+          bufferRequests.sort((a, b) => a.offset - b.offset);
+          const minOffset = bufferRequests[0].offset;
+          const maxOffset = Math.max(...bufferRequests.map((r) => r.offset + r.length));
+          const totalLength = maxOffset - minOffset;
+
+          const { buffer, relOffset: baseRelOffset } = await node.structure.scheduleRequest({
+            offset: minOffset,
+            length: totalLength,
+            componentType: null,
+          });
 
-            loadedAttributes.forEach(([name, attribute]) => {
-              geometry.setAttribute(name, attribute);
-            });
+          for (const req of bufferRequests) {
+            const relOffset = req.offset - minOffset;
+            req.data = node.structure.createTypedArray(buffer, baseRelOffset + relOffset, req.length, req.componentType);
+          }
 
-            if (primitive.indices !== undefined) {
-              const indexAttribute = await node.structure.createBufferAttribute(primitive.indices);
-              geometry.setIndex(indexAttribute);
+          for (let primIdx = 0; primIdx < meshDef.primitives.length; primIdx++) {
+            const primitive = meshDef.primitives[primIdx];
+            const geometry = new BufferGeometry();
+            const reqs = primitiveReqMap.get(primIdx);
+
+            if (primitive.attributes.POSITION !== undefined) {
+              const req = reqs.find((r) => r.type === "position" && r.accessorIndex === primitive.attributes.POSITION);
+              const accessor = node.structure.json.accessors[primitive.attributes.POSITION];
+              const components = node.structure.getNumComponents(accessor.type);
+              geometry.setAttribute("position", new BufferAttribute(req.data, components));
             }
 
-            this.currentPrimitiveMode = primitive.mode;
+            if (primitive.attributes.NORMAL !== undefined) {
+              const req = reqs.find((r) => r.type === "normal" && r.accessorIndex === primitive.attributes.NORMAL);
+              const accessor = node.structure.json.accessors[primitive.attributes.NORMAL];
+              const components = node.structure.getNumComponents(accessor.type);
+              geometry.setAttribute("normal", new BufferAttribute(req.data, components));
+            }
+
+            if (primitive.attributes.TEXCOORD_0 !== undefined) {
+              const req = reqs.find((r) => r.type === "uv" && r.accessorIndex === primitive.attributes.TEXCOORD_0);
+              const accessor = node.structure.json.accessors[primitive.attributes.TEXCOORD_0];
+              const components = node.structure.getNumComponents(accessor.type);
+              geometry.setAttribute("uv", new BufferAttribute(req.data, components));
+            }
+
+            if (primitive.indices !== undefined) {
+              const req = reqs.find((r) => r.type === "index" && r.accessorIndex === primitive.indices);
+              geometry.setIndex(new BufferAttribute(req.data, 1));
+            }
 
             let material;
             if (primitive.material !== undefined) {
@@ -68030,8 +68154,7 @@ void main() {
               Material.prototype.copy.call(pointsMaterial, material);
               pointsMaterial.color.copy(material.color);
               pointsMaterial.map = material.map;
-              pointsMaterial.sizeAttenuation = false; // glTF spec says points should be 1px
-
+              pointsMaterial.sizeAttenuation = false;
               mesh = new Points(geometry, pointsMaterial);
             } else if (
               primitive.mode === GL_CONSTANTS.TRIANGLES ||
@@ -68040,7 +68163,6 @@ void main() {
               primitive.mode === undefined
             ) {
               mesh = new Mesh(geometry, material);
-
               if (primitive.mode === GL_CONSTANTS.TRIANGLE_STRIP) {
                 mesh.drawMode = TriangleStripDrawMode;
               } else if (primitive.mode === GL_CONSTANTS.TRIANGLE_FAN) {
@@ -68053,39 +68175,30 @@ void main() {
             } else if (primitive.mode === GL_CONSTANTS.LINE_LOOP) {
               mesh = new LineLoop(geometry, material);
             }
-
             if (node.extras) {
               mesh.userData = { ...mesh.userData, ...node.extras };
             }
-
             if (meshDef.extras) {
               mesh.userData = { ...mesh.userData, ...meshDef.extras };
             }
-
             if (primitive.extras) {
               mesh.userData = { ...mesh.userData, ...primitive.extras };
             }
-
             if (node.handle) {
               mesh.userData.handle = node.handle;
             } else {
               mesh.userData.handle = `${node.structure.id}_${mesh.userData.handle}`;
             }
-
             if (mesh.material.name === "edges") {
               mesh.userData.isEdge = true;
             } else {
               mesh.userData.isEdge = false;
             }
-
             this.registerObjectWithHandle(mesh, mesh.userData.handle);
-
             mesh.position.copy(node.position);
-
             if (!geometry.attributes.normal) {
               geometry.computeVertexNormals();
             }
-
             if (material.aoMap && geometry.attributes.uv) {
               geometry.setAttribute("uv2", geometry.attributes.uv);
             }
@@ -68095,17 +68208,17 @@ void main() {
               this.scene.add(mesh);
             }
             node.object = mesh;
-
             this.totalLoadedObjects++;
             mesh.visible = this.totalLoadedObjects < this.graphicsObjectLimit;
           }
-
           node.loaded = true;
           node.loading = false;
-
           const geometrySize = this.estimateGeometrySize(node.object);
           this.geometryCache.set(node.object.uuid, geometrySize);
           this.currentMemoryUsage += geometrySize;
+          if (onLoadFinishCb) {
+            onLoadFinishCb();
+          }
         } catch (error) {
           if (error.name !== "AbortError") {
             console.error(`Error loading node ${nodeId}:`, error);
@@ -68230,7 +68343,7 @@ void main() {
           return volumeB - volumeA;
         });
 
-        if (!ignoreEdges) {
+        if (!ignoreEdges && this.visibleEdges) {
           this.nodesToLoad.push(...this.edgeNodes);
         }
 
@@ -68357,33 +68470,13 @@ void main() {
       async processNodes() {
         const nodesToLoad = this.nodesToLoad;
         let loadedCount = 0;
+        let lastLoadedCount = 0;
         const totalNodes = nodesToLoad.length;
 
-        try {
-          while (loadedCount < totalNodes) {
-            const batch = nodesToLoad.slice(loadedCount, loadedCount + this.batchSize);
-            const batchPromises = [];
-
-            for (const nodeId of batch) {
-              if (this.abortController.signal.aborted) {
-                throw new DOMException("Loading aborted", "AbortError");
-              }
-
-              const estimatedSize = await this.estimateNodeSize(nodeId);
-
-              if (this.currentMemoryUsage + estimatedSize > this.memoryLimit) {
-                console.log(`Memory limit reached after loading ${loadedCount} nodes`);
-                this.dispatchEvent("geometryerror", { message: "Memory limit reached" });
-                this.dispatchEvent("update");
-                return loadedCount;
-              }
-
-              batchPromises.push(this.loadNode(nodeId));
-            }
-
-            await Promise.all(batchPromises);
-            loadedCount += batch.length;
-
+        const loadProgress = async () => {
+          loadedCount++;
+          if (loadedCount - lastLoadedCount > 1000) {
+            lastLoadedCount = loadedCount;
             this.updateMemoryIndicator();
             this.dispatchEvent("geometryprogress", {
               percentage: Math.round((loadedCount / totalNodes) * 100),
@@ -68401,6 +68494,34 @@ void main() {
               setTimeout(resolve, 0);
             });
           }
+        };
+
+        try {
+          const loadOperations = [];
+          for (const nodeId of nodesToLoad) {
+            if (this.abortController.signal.aborted) {
+              throw new DOMException("Loading aborted", "AbortError");
+            }
+
+            const estimatedSize = await this.estimateNodeSize(nodeId);
+
+            if (this.currentMemoryUsage + estimatedSize > this.memoryLimit) {
+              console.log(`Memory limit reached after loading ${loadedCount} nodes`);
+              this.dispatchEvent("geometryerror", {
+                message: "Memory limit reached",
+              });
+              this.dispatchEvent("update");
+              return loadedCount;
+            }
+
+            loadOperations.push(this.loadNode(nodeId, loadProgress));
+          }
+
+          for (const structure of this.structures) {
+            loadOperations.push(structure.flushBufferRequests());
+          }
+
+          await Promise.all(loadOperations);
 
           this.dispatchEvent("geometryend", {
             totalLoaded: loadedCount,
@@ -69381,6 +69502,25 @@ void main() {
           }
         });
       }
+
+      // Возвращает bounding box для конкретной структуры
+      getStructureGeometryExtent(structureId) {
+        const extent = new Box3();
+        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);
+            }
+          }
+          extent.union(transformedBox);
+        }
+        return extent;
+      }
     }
 
     ///////////////////////////////////////////////////////////////////////////////
@@ -69409,7 +69549,6 @@ void main() {
         constructor(viewer) {
             this.requestId = 0;
             this.viewer = viewer;
-            this.scene = new Group$1();
         }
         dispose() {
             if (this.gltfLoader)
@@ -69423,27 +69562,25 @@ void main() {
                 /.gltf$/i.test(file.database));
         }
         async load(model, format, params) {
-            this.gltfLoader = new DynamicGltfLoader(this.viewer.camera, this.viewer.scene, this.viewer.renderer);
+            const scene = new Group$1();
+            this.gltfLoader = new DynamicGltfLoader(this.viewer.camera, scene, this.viewer.renderer);
             this.gltfLoader.memoryLimit = this.viewer.options.memoryLimit;
             this.gltfLoader.addEventListener("databasechunk", (data) => {
-                const modelImpl = new DynamicModelImpl(this.scene);
+                const modelImpl = new DynamicModelImpl(scene);
                 modelImpl.loader = this;
                 modelImpl.gltfLoader = this.gltfLoader;
                 modelImpl.viewer = this.viewer;
-                this.viewer.scene.add(this.scene);
+                this.viewer.scene.add(scene);
                 this.viewer.models.push(modelImpl);
                 this.viewer.syncOptions();
                 this.viewer.syncOverlay();
                 this.viewer.update();
-                this.viewer.emitEvent({ type: "databasechunk", data, file: model.file, model });
+                this.viewer.emitEvent({ type: "databasechunk", data: scene, file: model.file, model });
             });
             this.gltfLoader.addEventListener("geometryprogress", (data) => {
                 const progress = data.loaded / data.total;
                 this.viewer.emitEvent({ type: "geometryprogress", data: progress, file: model.file, model });
             });
-            this.gltfLoader.addEventListener("geometrymemory", (data) => {
-                this.viewer.emit({ type: "geometryprogress", data });
-            });
             this.gltfLoader.addEventListener("geometryerror", (data) => {
                 this.viewer.emitEvent({ type: "geometryerror", data, file: model.file, model });
             });
@@ -69477,9 +69614,8 @@ void main() {
             return this;
         }
         cancel() {
-            if (this.gltfLoader) {
+            if (this.gltfLoader)
                 this.gltfLoader.abortLoading();
-            }
         }
     }
 
@@ -69517,7 +69653,7 @@ void main() {
      *
      *    The loader should do:
      *
-     *    - Load scene from file. The scene must be a Three.js object of type `Object3D` or a descendant of it.
+     *    - Load raw data from file and convert it to the `Three.js` scene.
      *    - Add scene to the viewer `scene`.
      *    - Create `ModelImpl` for the scene and to the viewer `models` list.
      *    - Synchronize viewer options and overlay.
@@ -81628,7 +81764,7 @@ void main() {
                 const attrs = e.target.attrs;
                 if (attrs.rotation !== this._ref.rotation()) this._ref.rotation(attrs.rotation);
             }));
-            this._ref.on("transformend", (e => {
+            this._ref.on("transformend", (() => {
                 const absoluteTransform = this._ref.getAbsoluteTransform();
                 const wcsPoints = [];
                 const points = this._ref.points();
@@ -81650,7 +81786,7 @@ void main() {
                 }
                 this._ref.setAttr("wcsPoints", wcsPoints);
             }));
-            this._ref.on("dragend", (e => {
+            this._ref.on("dragend", (() => {
                 const absoluteTransform = this._ref.getAbsoluteTransform();
                 const wcsPoints = [];
                 const points = this._ref.points();
@@ -81840,7 +81976,7 @@ void main() {
                 });
                 this._ref.setAttr("wcsStart", this._worldTransformer.screenToWorld(position));
             }));
-            this._ref.on("dragend", (e => {
+            this._ref.on("dragend", (() => {
                 const absoluteTransform = this._ref.getStage().getAbsoluteTransform();
                 const position = absoluteTransform.point({
                     x: this._ref.x(),
@@ -82028,7 +82164,7 @@ void main() {
                     y: position.y + this._ref.height()
                 }));
             }));
-            this._ref.on("dragend", (e => {
+            this._ref.on("dragend", (() => {
                 const absoluteTransform = this._ref.getStage().getAbsoluteTransform();
                 const position = absoluteTransform.point({
                     x: this._ref.x(),
@@ -82253,7 +82389,7 @@ void main() {
                     y: 1
                 });
             }));
-            this._ref.on("transformend", (e => {
+            this._ref.on("transformend", (() => {
                 const absoluteTransform = this._ref.getStage().getAbsoluteTransform();
                 const position = absoluteTransform.point({
                     x: this._ref.x(),
@@ -82271,7 +82407,7 @@ void main() {
                 });
                 this._ref.setAttr("wcsRadiusY", this._worldTransformer.screenToWorld(radiusY));
             }));
-            this._ref.on("dragend", (e => {
+            this._ref.on("dragend", (() => {
                 const absoluteTransform = this._ref.getStage().getAbsoluteTransform();
                 const position = absoluteTransform.point({
                     x: this._ref.x(),
@@ -82685,7 +82821,7 @@ void main() {
                     y: 1
                 });
             }));
-            this._ref.on("transformend", (e => {
+            this._ref.on("transformend", (() => {
                 const absoluteTransform = this._ref.getStage().getAbsoluteTransform();
                 const position = absoluteTransform.point({
                     x: this._ref.x(),
@@ -82697,7 +82833,7 @@ void main() {
                     y: position.y + this._ref.height()
                 }));
             }));
-            this._ref.on("dragend", (e => {
+            this._ref.on("dragend", (() => {
                 const absoluteTransform = this._ref.getStage().getAbsoluteTransform();
                 const position = absoluteTransform.point({
                     x: this._ref.x(),
@@ -82986,7 +83122,7 @@ void main() {
                     y: position.y + this._ref.height()
                 }));
             }));
-            this._ref.on("dragend", (e => {
+            this._ref.on("dragend", (() => {
                 const absoluteTransform = this._ref.getStage().getAbsoluteTransform();
                 const position = absoluteTransform.point({
                     x: this._ref.x(),
@@ -83188,12 +83324,12 @@ void main() {
                     markupObject.updateScreenCoordinates();
                 }));
             };
-            this.pan = event => {
+            this.pan = () => {
                 this.getObjects().forEach((markupObject => {
                     markupObject.updateScreenCoordinates();
                 }));
             };
-            this.zoomAt = event => {
+            this.zoomAt = () => {
                 this.getObjects().forEach((markupObject => {
                     markupObject.updateScreenCoordinates();
                 }));
@@ -83456,7 +83592,7 @@ void main() {
                     lastLine = this.addLine([ pos.x, pos.y, pos.x, pos.y ]);
                 }
             }));
-            stage.on("mouseup touchend", (e => {
+            stage.on("mouseup touchend", (() => {
                 if (!this._markupIsActive) return;
                 if (isPaint) {
                     const pos = this.getRelativePointerPosition(stage);
@@ -83498,7 +83634,7 @@ void main() {
                 lastObj = undefined;
                 isPaint = false;
             }));
-            stage.on("mousemove touchmove", (e => {
+            stage.on("mousemove touchmove", (() => {
                 if (!this._markupIsActive) return;
                 if (!isPaint) {
                     return;
@@ -83878,7 +84014,7 @@ void main() {
                         y: this._imageInputPos.y
                     }, null, base64.toString(), 0, 0);
                 };
-                this._imageInputRef.oncancel = event => {
+                this._imageInputRef.oncancel = () => {
                     this.removeImageInput();
                 };
                 document.body.appendChild(this._imageInputRef);
@@ -84065,13 +84201,17 @@ void main() {
             this.addEventListener("optionschange", (event) => this.syncOptions(event.data));
             this.scene = new Scene();
             this.helpers = new Scene();
+            this.target = new Vector3();
             const pixelRatio = window.devicePixelRatio;
             const rect = canvas.parentElement.getBoundingClientRect();
             const width = rect.width || 1;
             const height = rect.height || 1;
             const aspect = width / height;
             this.camera = new PerspectiveCamera(45, aspect, 0.01, 1000);
-            this.camera.up.set(0, 0, 1);
+            this.camera.up.set(0, 1, 0);
+            this.camera.position.set(0, 0, 1);
+            this.camera.lookAt(this.target);
+            this.camera.updateProjectionMatrix();
             this.renderer = new WebGLRenderer({
                 canvas,
                 antialias: true,