@jdultra/threedtiles 3.1.3 → 3.1.4

package/README.md

@@ -34,8 +34,7 @@ setInterval(function () {
 - callback on loaded geometry to assign a custom material or use the meshes for computations.
 - Optionally load low detail tiles outside of view frustum for correct shadows and basic mesh present when the camera moves quickly.
 - Share a cache between tileset instances
-- Automatically tune the geometric error multiplier to 60 FPS
-- Automatic scaling of the cache
+- Optimal tile load order
 
 ### geometric Error Multiplier
 The geometric error multiplier allows you to multiply the geometric error by a factor.
@@ -53,27 +52,6 @@ const ogc3DTile = new OGC3DTile({
 A lower value will result in lower detail tiles being loaded and a higher value results in higher detail tiles being loaded.
 A value of 1.0 is the default.
 
-#### Automatic Geometric error multiplier
-In order to reach a steady 60 FPS, you can specify a TilesetStats object. 
-This object is basically the Stats object from the Three.js samples without the UI component.
-It must be updated in the animate function and given to the tileset at construction.
-```
-import TilesetStats from '@jdultra/threedtiles/src/tileset/TilesetStats';
-
-const tilesetStats = TilesetStats();
-
-const ogc3DTile = new OGC3DTile({
-    url: "https://storage.googleapis.com/ogc-3d-tiles/ayutthaya/tileset.json",
-    stats: tilesetStats
-});
-
-function animate() {
-    
-    ...
-    
-    tilesetStats.update();
-}
-```
 
 
 ### load tiles outside of view
@@ -98,12 +76,14 @@ const ogc3DTile = new OGC3DTile({
         }
 });
 ```
+If using a shared cache between tilesets, check out the next section.
 
 ### Cache
 You may instanciate a cache through the TileLoader class and re-use it for several or all your tilesets. 
 The limitation is that all the tilesets using the same cache will have the same callback.
 
-If a TilesetStats object is passed, it will be used to monitor the size of the cache when the browser allows it, otherwise, each cache is limitted to 1000 items.
+The TileLoader constructor takes 2 arguments. The first is a callback for meshes (see above section) and the second is
+the maximum number of items in the cache (default is 1000).
 
 ```
 import { TileLoader } from "@jdultra/threedtiles/src/tileset/TileLoader";
@@ -114,7 +94,9 @@ const ogc3DTile = new OGC3DTile({
             //// Insert code to be called on every newly decoded mesh e.g.:
             mesh.material.wireframe = false;
             mesh.material.side = THREE.DoubleSide;
-        }, tilesetStats),
+            }, 
+            2000
+        ),
         meshCallback: mesh => { mesh.material.wireframe = true;} // This callback will not be used as the callback provided to the TileLoader takes priority
     });
 ```

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@jdultra/threedtiles",
-    "version": "3.1.3",
+    "version": "3.1.4",
     "description": "An OGC 3DTiles viewer for Three.js",
     "main": "tileset.js",
     "scripts": {

package/src/index.js

@@ -4,6 +4,7 @@ import Stats from 'three/examples/jsm/libs/stats.module.js';
 import { OGC3DTile } from "./tileset/OGC3DTile";
 import { TileLoader } from "./tileset/TileLoader";
 import { MapControls, OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js';
+import { setIntervalAsync } from 'set-interval-async/dynamic';
 
 
 const scene = initScene();
@@ -76,14 +77,14 @@ function initCamera() {
 function initTileset(scene) {
 
     const ogc3DTile = new OGC3DTile({
-        url: "https://storage.googleapis.com/ogc-3d-tiles/ayutthaya/tileset.json",
+        url: "https://storage.googleapis.com/ogc-3d-tiles/ayutthaya/tiledWithSkirts/tileset.json",
         geometricErrorMultiplier: 1.0,
         loadOutsideView: true,
         tileLoader: new TileLoader(mesh => {
             //// Insert code to be called on every newly decoded mesh e.g.:
             mesh.material.wireframe = false;
             mesh.material.side = THREE.DoubleSide;
-        }, 2000)
+        }, 1000)
     });
     
 
@@ -112,7 +113,7 @@ function initTileset(scene) {
         }
     });
     function startInterval(){
-        interval = setInterval(function () {
+        interval = setIntervalAsync(function () {
             ogc3DTile.update(camera);
         }, 20);
     }

package/src/tileset/TileLoader.js

@@ -1,5 +1,6 @@
 import { LinkedHashMap } from 'js-utils-z';
 import { B3DMDecoder } from "../decoder/B3DMDecoder";
+import { setIntervalAsync } from 'set-interval-async/dynamic';
 
 const ready = [];
 const downloads = [];
@@ -8,29 +9,28 @@ const nextDownloads = [];
 
 function scheduleDownload(f) {
     downloads.unshift(f);
-    //setTimeout(()=>download(),0);
 }
 function download() {
     if (nextDownloads.length == 0) {
         getNextDownloads();
-        if (nextDownloads.length == 0) return;
+        if (nextDownloads.length == 0) return 0;
     }
     const nextDownload = nextDownloads.shift();
     if (!!nextDownload && nextDownload.shouldDoDownload()) {
         nextDownload.doDownload();
     }
+    return 1;
 }
 function meshReceived(cache, register, key, distanceFunction, getSiblings, level, uuid) {
     ready.unshift([cache, register, key, distanceFunction, getSiblings, level, uuid]);
-    //setTimeout(()=>loadBatch(),1);
 }
 function loadBatch() {
     if (nextReady.length == 0) {
         getNextReady();
-        if (nextReady.length == 0) return;
+        if (nextReady.length == 0) return 0;
     }
     const data = nextReady.shift();
-    if (!data) return;
+    if (!data) return 0;
     const cache = data[0];
     const register = data[1];
     const key = data[2];
@@ -44,6 +44,7 @@ function loadBatch() {
             }
         });
     }
+    return 1;
 }
 
 function getNextDownloads() {
@@ -115,12 +116,22 @@ function getNextReady() {
         }
     }
 }
-setInterval(() => {
-    download()
-}, 1)
-setInterval(() => {
-    loadBatch()
-}, 1)
+setIntervalAsync(()=>{
+    const start = Date.now();
+    let uploaded = 0;
+    do{
+        uploaded = download();
+    }while(uploaded > 0 && (Date.now() - start)<= 2 )
+    
+},10);
+setIntervalAsync(()=>{
+    const start = Date.now();
+    let loaded = 0;
+    do{
+        loaded = loadBatch();
+    }while(loaded > 0 && (Date.now() - start)<= 2 )
+    
+},10);
 
 class TileLoader {
     constructor(meshCallback, maxCachedItems) {
@@ -208,7 +219,6 @@ class TileLoader {
         let i = 0;
 
         while (self.cache.size() > self.maxCachedItems && i < self.cache.size()) {
-            console.log(self.cache.size())
             i++;
             const entry = self.cache.head();
             const reg = self.register[entry.key];