@inweb/viewer-three 26.9.0 → 26.9.2

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

@@ -23,7 +23,7 @@ import {
   BufferAttribute,
   LineBasicMaterial,
 } from "three";
-import { GltfStructure, GL_CONSTANTS } from "./GltfStructure.js";
+import { GL_CONSTANTS } from "./GltfStructure.js";
 import { mergeGeometries } from "three/examples/jsm/utils/BufferGeometryUtils.js";
 
 export class DynamicGltfLoader {
@@ -94,6 +94,10 @@ export class DynamicGltfLoader {
     this.hiddenHandles = new Set();
     this.newOptimizedObjects = new Set();
     this.oldOptimizeObjects = new Set();
+
+    this.maxConcurrentChunks = 8;
+    this.activeChunkLoads = 0;
+    this.chunkQueue = [];
   }
 
   setVisibleEdges(visible) {
@@ -503,6 +507,7 @@ export class DynamicGltfLoader {
     const structureArray = Array.isArray(structures) ? structures : [structures];
 
     for (const structure of structureArray) {
+      await structure.initialize(this);
       this.structures.push(structure);
     }
 
@@ -894,13 +899,6 @@ export class DynamicGltfLoader {
     this.nodesToLoad = [];
   }
 
-  async addStructure(loadController) {
-    const structure = new GltfStructure();
-    await structure.initialize(loadController);
-    this.structures.push(structure);
-    return structure;
-  }
-
   removeOptimization() {
     this.originalObjects.forEach((obj) => (obj.visible = true));
 
@@ -932,7 +930,8 @@ export class DynamicGltfLoader {
   }
 
   clear() {
-    // Clear all structures
+    this.chunkQueue = [];
+
     this.structures.forEach((structure) => {
       if (structure) {
         structure.clear();
@@ -973,7 +972,6 @@ export class DynamicGltfLoader {
     });
     this.loadedMeshes.clear();
 
-    // Clear all structure roots and their children
     this.structureRoots.forEach((rootGroup) => {
       if (rootGroup) {
         rootGroup.traverse((child) => {
@@ -993,7 +991,6 @@ export class DynamicGltfLoader {
     });
     this.structureRoots.clear();
 
-    // Clear all optimized objects
     this.mergedMesh.forEach((mesh) => {
       if (mesh.geometry) mesh.geometry.dispose();
       if (mesh.material) {
@@ -1746,7 +1743,6 @@ export class DynamicGltfLoader {
     });
   }
 
-  // Возвращает bounding box для конкретной структуры
   getStructureGeometryExtent(structureId) {
     const extent = new Box3();
     for (const [nodeId, node] of this.nodes.entries()) {
@@ -1764,4 +1760,33 @@ export class DynamicGltfLoader {
     }
     return extent;
   }
+
+  setMaxConcurrentChunks(maxChunks) {
+    if (maxChunks < 1) {
+      console.warn("Max concurrent chunks must be at least 1");
+      return;
+    }
+    this.maxConcurrentChunks = maxChunks;
+  }
+
+  waitForChunkSlot() {
+    if (this.activeChunkLoads < this.maxConcurrentChunks) {
+      this.activeChunkLoads++;
+      return Promise.resolve();
+    }
+
+    return new Promise((resolve) => {
+      this.chunkQueue.push(resolve);
+    });
+  }
+
+  releaseChunkSlot() {
+    this.activeChunkLoads--;
+
+    if (this.chunkQueue.length > 0) {
+      const nextResolve = this.chunkQueue.shift();
+      this.activeChunkLoads++;
+      nextResolve();
+    }
+  }
 }

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

@@ -43,11 +43,12 @@ const MAX_GAP = 128 * 1024; // 128 KB
 const MAX_CHUNK = 30 * 1024 * 1024; // 100 MB
 
 export class GltfStructure {
-  constructor(id) {
+  constructor(id, loadController) {
     this.id = `${id}`;
     this.json = null;
     this.baseUrl = "";
-    this.loadController = null;
+    this.loadController = loadController;
+    this.loader = null;
     this.batchDelay = 10;
     this.maxBatchSize = 5 * 1024 * 1024;
     this.maxRangesPerRequest = 512;
@@ -59,10 +60,10 @@ export class GltfStructure {
     this.materialCache = new Map();
   }
 
-  async initialize(loadController) {
-    this.json = await loadController.loadJson();
-    this.baseUrl = await loadController.baseUrl();
-    this.loadController = loadController;
+  async initialize(loader) {
+    this.json = await this.loadController.loadJson();
+    this.baseUrl = await this.loadController.baseUrl();
+    this.loader = loader;
   }
 
   clear() {
@@ -75,10 +76,12 @@ export class GltfStructure {
       this.batchTimeout = null;
     }
 
-    // Clear materials and textures
     this.disposeMaterials();
     this.textureCache.clear();
     this.materials.clear();
+
+    this.activeChunkLoads = 0;
+    this.chunkQueue = [];
   }
 
   getJson() {
@@ -157,35 +160,32 @@ export class GltfStructure {
         finalRanges.push({ start, end, requests });
       }
     }
-    /*
-    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, index) => {
+      await this.loader.waitForChunkSlot();
+
+      try {
+        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);
+          }
         }
-      }
-    }
-    */
-
-    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);
+      } catch (error) {
+        for (const req of range.requests) {
+          req._reject(error);
         }
+        console.warn(`Failed to load chunk ${index + 1}/${finalRanges.length} (${range.start}-${range.end}):`, error);
+      } finally {
+        this.loader.releaseChunkSlot();
       }
     });
+
     await Promise.all(promises);
 
     this.pendingRequests = [];

package/src/Viewer/loaders/GLTFCloudDynamicLoader.ts

@@ -58,6 +58,7 @@ export class GLTFCloudDynamicLoader implements ILoader {
     this.gltfLoader = new DynamicGltfLoader(this.viewer.camera, scene, this.viewer.renderer);
     this.gltfLoader.memoryLimit = this.viewer.options.memoryLimit;
     this.gltfLoader.setVisibleEdges(this.viewer.options.edgeModel);
+    // this.gltfLoader.setMaxConcurrentChunks(this.viewer.options.maxConcurrentChunks);
 
     this.gltfLoader.addEventListener("databasechunk", (data) => {
       const modelImpl = new DynamicModelImpl(scene);
@@ -126,8 +127,7 @@ export class GLTFCloudDynamicLoader implements ILoader {
       baseUrl: () => Promise.resolve(`${model.httpClient.serverUrl}${model.path}/`),
     };
 
-    const structure = new GltfStructure(model.id);
-    await structure.initialize(loadController);
+    const structure = new GltfStructure(model.id, loadController);
 
     await this.gltfLoader.loadStructure(structure);
     await this.gltfLoader.loadNodes();