@loaders.gl/tiles 3.1.7 → 3.2.0-alpha.2

package/dist/tileset/tileset-3d.js

@@ -62,6 +62,10 @@ const DEFAULT_PROPS = {
     // Number of simultaneous requsts, if throttleRequests is true
     maxRequests: 64,
     maximumMemoryUsage: 32,
+    /** Maximum number limit of tiles selected for show. 0 means no limit */
+    maximumTilesSelected: 0,
+    /** Delay time before the tileset traversal. It prevents traversal requests spam.*/
+    debounceTime: 0,
     /**
      * Callback. Indicates this a tile's content was loaded
      * @param tile {TileHeader}
@@ -83,7 +87,6 @@ const DEFAULT_PROPS = {
     contentLoader: undefined,
     // View distance scale modifier
     viewDistanceScale: 1.0,
-    // TODO CESIUM
     // The maximum screen space error used to drive level of detail refinement.
     maximumScreenSpaceError: 8,
     loadTiles: true,
@@ -113,6 +116,7 @@ class Tileset3D {
      */
     // eslint-disable-next-line max-statements
     constructor(json, options) {
+        this.updatePromise = null;
         (0, loader_utils_1.assert)(json);
         // PUBLIC MEMBERS
         this.options = { ...DEFAULT_PROPS, ...options };
@@ -177,7 +181,7 @@ class Tileset3D {
         this.asset = {};
         this.credits = {};
         this.description = this.options.description || '';
-        this._initializeTileSet(json);
+        this.tilesetInitializationPromise = this._initializeTileSet(json);
     }
     /** Release resources */
     destroy() {
@@ -225,21 +229,54 @@ class Tileset3D {
     /**
      * Update visible tiles relying on a list of viewports
      * @param viewports - list of viewports
+     * @deprecated
+     */
+    update(viewports = null) {
+        // eslint-disable-next-line @typescript-eslint/no-floating-promises
+        this.tilesetInitializationPromise.then(() => {
+            if (!viewports && this.lastUpdatedVieports) {
+                viewports = this.lastUpdatedVieports;
+            }
+            else {
+                this.lastUpdatedVieports = viewports;
+            }
+            this.doUpdate(viewports);
+        });
+    }
+    /**
+     * Update visible tiles relying on a list of viewports.
+     * Do it with debounce delay to prevent update spam
+     * @param viewports viewports
+     * @returns Promise of new frameNumber
+     */
+    async selectTiles(viewports = null) {
+        await this.tilesetInitializationPromise;
+        if (viewports) {
+            this.lastUpdatedVieports = viewports;
+        }
+        if (!this.updatePromise) {
+            this.updatePromise = new Promise((resolve) => {
+                setTimeout(() => {
+                    this.doUpdate(this.lastUpdatedVieports);
+                    resolve(this._frameNumber);
+                    this.updatePromise = null;
+                }, this.options.debounceTime);
+            });
+        }
+        return this.updatePromise;
+    }
+    /**
+     * Update visible tiles relying on a list of viewports
+     * @param viewports viewports
      */
     // eslint-disable-next-line max-statements, complexity
-    update(viewports) {
+    doUpdate(viewports = null) {
         if ('loadTiles' in this.options && !this.options.loadTiles) {
             return;
         }
         if (this.traverseCounter > 0) {
             return;
         }
-        if (!viewports && this.lastUpdatedVieports) {
-            viewports = this.lastUpdatedVieports;
-        }
-        else {
-            this.lastUpdatedVieports = viewports;
-        }
         if (!(viewports instanceof Array)) {
             viewports = [viewports];
         }
@@ -296,7 +333,11 @@ class Tileset3D {
         }
         const currentFrameStateData = this.frameStateData[id];
         const selectedTiles = Object.values(this._traverser.selectedTiles);
-        currentFrameStateData.selectedTiles = selectedTiles;
+        const [filteredSelectedTiles, unselectedTiles] = (0, frame_state_1.limitSelectedTiles)(selectedTiles, frameState, this.options.maximumTilesSelected);
+        currentFrameStateData.selectedTiles = filteredSelectedTiles;
+        for (const tile of unselectedTiles) {
+            tile.unselect();
+        }
         currentFrameStateData._requestedTiles = Object.values(this._traverser.requestedTiles);
         currentFrameStateData._emptyTiles = Object.values(this._traverser.emptyTiles);
         this.traverseCounter--;
@@ -366,26 +407,64 @@ class Tileset3D {
         this.stats.get(TILES_RENDERABLE).count = tilesRenderable;
         this.stats.get(POINTS_COUNT).count = pointsRenderable;
     }
-    _initializeTileSet(tilesetJson) {
+    async _initializeTileSet(tilesetJson) {
+        if (this.type === constants_1.TILESET_TYPE.I3S) {
+            this.calculateViewPropsI3S();
+            tilesetJson.root = await tilesetJson.root;
+        }
         this.root = this._initializeTileHeaders(tilesetJson, null);
-        // TODO CESIUM Specific
         if (this.type === constants_1.TILESET_TYPE.TILES3D) {
-            this._initializeCesiumTileset(tilesetJson);
+            this._initializeTiles3DTileset(tilesetJson);
+            this.calculateViewPropsTiles3D();
         }
         if (this.type === constants_1.TILESET_TYPE.I3S) {
             this._initializeI3STileset();
         }
-        // Calculate cartographicCenter & zoom props to help apps center view on tileset
-        this._calculateViewProps();
     }
-    // Called during initialize Tileset to initialize the tileset's cartographic center (longitude, latitude) and zoom.
-    _calculateViewProps() {
+    /**
+     * Called during initialize Tileset to initialize the tileset's cartographic center (longitude, latitude) and zoom.
+     * These metrics help apps center view on tileset
+     * For I3S there is extent (<1.8 version) or fullExtent (>=1.8 version) to calculate view props
+     * @returns
+     */
+    calculateViewPropsI3S() {
+        // for I3S 1.8 try to calculate with fullExtent
+        const fullExtent = this.tileset.fullExtent;
+        if (fullExtent) {
+            const { xmin, xmax, ymin, ymax, zmin, zmax } = fullExtent;
+            this.cartographicCenter = new core_1.Vector3(xmin + (xmax - xmin) / 2, ymin + (ymax - ymin) / 2, zmin + (zmax - zmin) / 2);
+            this.cartesianCenter = geospatial_1.Ellipsoid.WGS84.cartographicToCartesian(this.cartographicCenter, new core_1.Vector3());
+            this.zoom = (0, zoom_1.getZoomFromFullExtent)(fullExtent, this.cartographicCenter, this.cartesianCenter);
+            return;
+        }
+        // for I3S 1.6-1.7 try to calculate with extent
+        const extent = this.tileset.store?.extent;
+        if (extent) {
+            const [xmin, ymin, xmax, ymax] = extent;
+            this.cartographicCenter = new core_1.Vector3(xmin + (xmax - xmin) / 2, ymin + (ymax - ymin) / 2, 0);
+            this.cartesianCenter = geospatial_1.Ellipsoid.WGS84.cartographicToCartesian(this.cartographicCenter, new core_1.Vector3());
+            this.zoom = (0, zoom_1.getZoomFromExtent)(extent, this.cartographicCenter, this.cartesianCenter);
+            return;
+        }
+        // eslint-disable-next-line no-console
+        console.warn('Extent is not defined in the tileset header');
+        this.cartographicCenter = new core_1.Vector3();
+        this.zoom = 1;
+        return;
+    }
+    /**
+     * Called during initialize Tileset to initialize the tileset's cartographic center (longitude, latitude) and zoom.
+     * These metrics help apps center view on tileset.
+     * For 3DTiles the root tile data is used to calculate view props.
+     * @returns
+     */
+    calculateViewPropsTiles3D() {
         const root = this.root;
         (0, loader_utils_1.assert)(root);
         const { center } = root.boundingVolume;
         // TODO - handle all cases
         if (!center) {
-            // eslint-disable-next-line
+            // eslint-disable-next-line no-console
             console.warn('center was not pre-calculated for the root tile');
             this.cartographicCenter = new core_1.Vector3();
             this.zoom = 1;
@@ -419,7 +498,7 @@ class Tileset3D {
             parentTileHeader.children.push(rootTile);
             rootTile.depth = parentTileHeader.depth + 1;
         }
-        // Cesium 3d tiles knows the hierarchy beforehand
+        // 3DTiles knows the hierarchy beforehand
         if (this.type === constants_1.TILESET_TYPE.TILES3D) {
             const stack = [];
             stack.push(rootTile);
@@ -553,7 +632,7 @@ class Tileset3D {
         this._unloadTile(tile);
         tile.destroy();
     }
-    _initializeCesiumTileset(tilesetJson) {
+    _initializeTiles3DTileset(tilesetJson) {
         this.asset = tilesetJson.asset;
         if (!this.asset) {
             throw new Error('Tileset must have an asset property.');

package/dist/tileset/traversers/i3s-frame-counter.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Counter to register pending tile headers for the particular frameNumber
+ * Until all tiles are loaded we won't call `onTraversalEnd` callback
+ */
+export default class I3SPendingTilesRegister {
+    private frameNumberMap;
+    /**
+     * Register a new pending tile header for the particular frameNumber
+     * @param frameNumber
+     */
+    register(frameNumber: number): void;
+    /**
+     * Deregister a pending tile header for the particular frameNumber
+     * @param frameNumber
+     */
+    deregister(frameNumber: number): void;
+    /**
+     * Check is there are no pending tile headers registered for the particular frameNumber
+     * @param frameNumber
+     * @returns
+     */
+    isZero(frameNumber: number): boolean;
+}
+//# sourceMappingURL=i3s-frame-counter.d.ts.map

package/dist/tileset/traversers/i3s-frame-counter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"i3s-frame-counter.d.ts","sourceRoot":"","sources":["../../../src/tileset/traversers/i3s-frame-counter.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,MAAM,CAAC,OAAO,OAAO,uBAAuB;IAC1C,OAAO,CAAC,cAAc,CAAkC;IAExD;;;OAGG;IACH,QAAQ,CAAC,WAAW,EAAE,MAAM;IAK5B;;;OAGG;IACH,UAAU,CAAC,WAAW,EAAE,MAAM;IAK9B;;;;OAIG;IACH,MAAM,CAAC,WAAW,EAAE,MAAM;CAI3B"}

package/dist/tileset/traversers/i3s-frame-counter.js

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+/**
+ * Counter to register pending tile headers for the particular frameNumber
+ * Until all tiles are loaded we won't call `onTraversalEnd` callback
+ */
+class I3SPendingTilesRegister {
+    constructor() {
+        this.frameNumberMap = new Map();
+    }
+    /**
+     * Register a new pending tile header for the particular frameNumber
+     * @param frameNumber
+     */
+    register(frameNumber) {
+        const oldCount = this.frameNumberMap.get(frameNumber) || 0;
+        this.frameNumberMap.set(frameNumber, (oldCount || 0) + 1);
+    }
+    /**
+     * Deregister a pending tile header for the particular frameNumber
+     * @param frameNumber
+     */
+    deregister(frameNumber) {
+        const oldCount = this.frameNumberMap.get(frameNumber) || 1;
+        this.frameNumberMap.set(frameNumber, (oldCount || 0) - 1);
+    }
+    /**
+     * Check is there are no pending tile headers registered for the particular frameNumber
+     * @param frameNumber
+     * @returns
+     */
+    isZero(frameNumber) {
+        const count = this.frameNumberMap.get(frameNumber) || 0;
+        return count === 0;
+    }
+}
+exports.default = I3SPendingTilesRegister;

package/dist/tileset/traversers/i3s-tile-manager.d.ts

@@ -1,8 +1,16 @@
+import { FrameState } from '../helpers/frame-state';
 export default class I3STileManager {
     private _statusMap;
+    private pendingTilesRegister;
     constructor();
-    add(request: any, key: any, callback: any, frameState: any): void;
-    update(key: any, frameState: any): void;
+    add(request: any, key: any, callback: any, frameState: FrameState): void;
+    update(key: any, frameState: FrameState): void;
     find(key: any): any;
+    /**
+     * Check it there are pending tile headers for the particular frameNumber
+     * @param frameNumber
+     * @returns
+     */
+    hasPendingTiles(frameNumber: number): boolean;
 }
 //# sourceMappingURL=i3s-tile-manager.d.ts.map

package/dist/tileset/traversers/i3s-tile-manager.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"i3s-tile-manager.d.ts","sourceRoot":"","sources":["../../../src/tileset/traversers/i3s-tile-manager.ts"],"names":[],"mappings":"AAOA,MAAM,CAAC,OAAO,OAAO,cAAc;IACjC,OAAO,CAAC,UAAU,CAAS;;IAM3B,GAAG,CAAC,OAAO,KAAA,EAAE,GAAG,KAAA,EAAE,QAAQ,KAAA,EAAE,UAAU,KAAA;IAetC,MAAM,CAAC,GAAG,KAAA,EAAE,UAAU,KAAA;IAMtB,IAAI,CAAC,GAAG,KAAA;CAGT"}
+{"version":3,"file":"i3s-tile-manager.d.ts","sourceRoot":"","sources":["../../../src/tileset/traversers/i3s-tile-manager.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAC,MAAM,wBAAwB,CAAC;AAUlD,MAAM,CAAC,OAAO,OAAO,cAAc;IACjC,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,oBAAoB,CAAiC;;IAM7D,GAAG,CAAC,OAAO,KAAA,EAAE,GAAG,KAAA,EAAE,QAAQ,KAAA,EAAE,UAAU,EAAE,UAAU;IAsBlD,MAAM,CAAC,GAAG,KAAA,EAAE,UAAU,EAAE,UAAU;IAUlC,IAAI,CAAC,GAAG,KAAA;IAIR;;;;OAIG;IACH,eAAe,CAAC,WAAW,EAAE,MAAM,GAAG,OAAO;CAG9C"}

package/dist/tileset/traversers/i3s-tile-manager.js

@@ -1,5 +1,9 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
+const i3s_frame_counter_1 = __importDefault(require("./i3s-frame-counter"));
 const STATUS = {
     REQUESTED: 'REQUESTED',
     COMPLETED: 'COMPLETED',
@@ -8,29 +12,49 @@ const STATUS = {
 // A helper class to manage tile metadata fetching
 class I3STileManager {
     constructor() {
+        this.pendingTilesRegister = new i3s_frame_counter_1.default();
         this._statusMap = {};
     }
     add(request, key, callback, frameState) {
         if (!this._statusMap[key]) {
+            const { frameNumber } = frameState;
             this._statusMap[key] = { request, callback, key, frameState, status: STATUS.REQUESTED };
+            // Register pending request for the frameNumber
+            this.pendingTilesRegister.register(frameNumber);
             request()
                 .then((data) => {
                 this._statusMap[key].status = STATUS.COMPLETED;
+                // Deregister pending request for the frameNumber
+                this.pendingTilesRegister.deregister(frameNumber);
                 this._statusMap[key].callback(data, frameState);
             })
                 .catch((error) => {
                 this._statusMap[key].status = STATUS.ERROR;
+                // Deregister pending request for the frameNumber
+                this.pendingTilesRegister.deregister(frameNumber);
                 callback(error);
             });
         }
     }
     update(key, frameState) {
         if (this._statusMap[key]) {
+            // Deregister pending request for the old frameNumber
+            this.pendingTilesRegister.deregister(this._statusMap[key].frameState.frameNumber);
+            // Register pending request for the new frameNumber
+            this.pendingTilesRegister.register(frameState.frameNumber);
             this._statusMap[key].frameState = frameState;
         }
     }
     find(key) {
         return this._statusMap[key];
     }
+    /**
+     * Check it there are pending tile headers for the particular frameNumber
+     * @param frameNumber
+     * @returns
+     */
+    hasPendingTiles(frameNumber) {
+        return !this.pendingTilesRegister.isZero(frameNumber);
+    }
 }
 exports.default = I3STileManager;

package/dist/tileset/traversers/i3s-tileset-traverser.d.ts

@@ -1,9 +1,16 @@
 import TilesetTraverser from './tileset-traverser';
+import { FrameState } from '../helpers/frame-state';
 export default class I3STilesetTraverser extends TilesetTraverser {
     private _tileManager;
+    /**
+     * Check if there are no penging tile header requests,
+     * that means the traversal is finished and we can call
+     * following-up callbacks.
+     */
+    protected get traversalFinished(): boolean;
     constructor(options: any);
-    shouldRefine(tile: any, frameState: any): boolean;
-    updateChildTiles(tile: any, frameState: any): boolean;
+    shouldRefine(tile: any, frameState: FrameState): boolean;
+    updateChildTiles(tile: any, frameState: FrameState): boolean;
     _loadTile(nodeId: any, tileset: any): Promise<any>;
     /**
      * The callback to init TileHeader instance after loading the tile JSON

package/dist/tileset/traversers/i3s-tileset-traverser.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"i3s-tileset-traverser.d.ts","sourceRoot":"","sources":["../../../src/tileset/traversers/i3s-tileset-traverser.ts"],"names":[],"mappings":"AACA,OAAO,gBAAgB,MAAM,qBAAqB,CAAC;AAMnD,MAAM,CAAC,OAAO,OAAO,mBAAoB,SAAQ,gBAAgB;IAC/D,OAAO,CAAC,YAAY,CAAiB;gBAEzB,OAAO,KAAA;IAKnB,YAAY,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA;IAK7B,gBAAgB,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA,GAAG,OAAO;IAoCrC,SAAS,CAAC,MAAM,KAAA,EAAE,OAAO,KAAA;IAgB/B;;;;;;;OAOG;IACH,WAAW,CAAC,MAAM,KAAA,EAAE,IAAI,KAAA,EAAE,UAAU,KAAA;CAYrC"}
+{"version":3,"file":"i3s-tileset-traverser.d.ts","sourceRoot":"","sources":["../../../src/tileset/traversers/i3s-tileset-traverser.ts"],"names":[],"mappings":"AACA,OAAO,gBAAgB,MAAM,qBAAqB,CAAC;AAKnD,OAAO,EAAC,UAAU,EAAC,MAAM,wBAAwB,CAAC;AAElD,MAAM,CAAC,OAAO,OAAO,mBAAoB,SAAQ,gBAAgB;IAC/D,OAAO,CAAC,YAAY,CAAiB;IAErC;;;;OAIG;IACH,SAAS,KAAK,iBAAiB,IAAI,OAAO,CAEzC;gBAEW,OAAO,KAAA;IAKnB,YAAY,CAAC,IAAI,KAAA,EAAE,UAAU,EAAE,UAAU;IAKzC,gBAAgB,CAAC,IAAI,KAAA,EAAE,UAAU,EAAE,UAAU,GAAG,OAAO;IAoCjD,SAAS,CAAC,MAAM,KAAA,EAAE,OAAO,KAAA;IAgB/B;;;;;;;OAOG;IACH,WAAW,CAAC,MAAM,KAAA,EAAE,IAAI,KAAA,EAAE,UAAU,KAAA;CAerC"}

package/dist/tileset/traversers/i3s-tileset-traverser.js

@@ -13,6 +13,14 @@ class I3STilesetTraverser extends tileset_traverser_1.default {
         super(options);
         this._tileManager = new i3s_tile_manager_1.default();
     }
+    /**
+     * Check if there are no penging tile header requests,
+     * that means the traversal is finished and we can call
+     * following-up callbacks.
+     */
+    get traversalFinished() {
+        return !this._tileManager.hasPendingTiles(this._frameNumber || 0);
+    }
     shouldRefine(tile, frameState) {
         tile._lodJudge = (0, i3s_lod_1.getLodStatus)(tile, frameState);
         return tile._lodJudge === 'DIG';
@@ -77,7 +85,8 @@ class I3STilesetTraverser extends tileset_traverser_1.default {
         const frameState = this._tileManager.find(childTile.id).frameState;
         this.updateTile(childTile, frameState);
         // after tile fetched, resume traversal if still in current update/traversal frame
-        if (this._frameNumber === frameState.frameNumber) {
+        if (this._frameNumber === frameState.frameNumber &&
+            (this.traversalFinished || new Date().getTime() - this.lastUpdate > this.updateDebounceTime)) {
             this.executeTraversal(childTile, frameState);
         }
     }

package/dist/tileset/traversers/tileset-traverser.d.ts

@@ -1,4 +1,5 @@
 import ManagedArray from '../../utils/managed-array';
+import { FrameState } from '../helpers/frame-state';
 export declare type TilesetTraverserProps = {
     loadSiblings?: boolean;
     skipLevelOfDetail?: boolean;
@@ -27,13 +28,16 @@ export default class TilesetTraverser {
     requestedTiles: object;
     selectedTiles: object;
     emptyTiles: object;
+    protected lastUpdate: number;
+    protected readonly updateDebounceTime = 1000;
     protected _traversalStack: ManagedArray;
     protected _emptyTraversalStack: ManagedArray;
     protected _frameNumber: number | null;
+    protected get traversalFinished(): boolean;
     constructor(options: TilesetTraverserProps);
     traverse(root: any, frameState: any, options: any): void;
     reset(): void;
-    executeTraversal(root: any, frameState: any): void;
+    executeTraversal(root: any, frameState: FrameState): void;
     updateChildTiles(tile: any, frameState: any): boolean;
     updateAndPushChildren(tile: any, frameState: any, stack: any, depth: any): boolean;
     updateTile(tile: any, frameState: any): void;

package/dist/tileset/traversers/tileset-traverser.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tileset-traverser.d.ts","sourceRoot":"","sources":["../../../src/tileset/traversers/tileset-traverser.ts"],"names":[],"mappings":"AAAA,OAAO,YAAY,MAAM,2BAA2B,CAAC;AAGrD,oBAAY,qBAAqB,GAAG;IAClC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,cAAc,CAAC,EAAE,CAAC,UAAU,KAAA,KAAK,GAAG,CAAC;IACrC,qBAAqB,CAAC,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAC,CAAC;IAC7C,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,oBAAY,KAAK,GAAG;IAClB,YAAY,EAAE,OAAO,CAAC;IACtB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,gBAAgB,EAAE,OAAO,CAAC;IAC1B,uBAAuB,EAAE,MAAM,CAAC;IAChC,cAAc,EAAE,CAAC,UAAU,KAAA,KAAK,GAAG,CAAC;IACpC,qBAAqB,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAC,CAAC;IAC5C,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAQ3B,CAAC;AAEF,MAAM,CAAC,OAAO,OAAO,gBAAgB;IACnC,OAAO,EAAE,KAAK,CAAC;IAEf,IAAI,EAAE,GAAG,CAAC;IACV,cAAc,EAAE,MAAM,CAAC;IACvB,aAAa,EAAE,MAAM,CAAC;IACtB,UAAU,EAAE,MAAM,CAAC;IAEnB,SAAS,CAAC,eAAe,EAAE,YAAY,CAAC;IACxC,SAAS,CAAC,oBAAoB,EAAE,YAAY,CAAC;IAC7C,SAAS,CAAC,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;gBAG1B,OAAO,EAAE,qBAAqB;IAuB1C,QAAQ,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA,EAAE,OAAO,KAAA;IAclC,KAAK;IAgBL,gBAAgB,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA;IA+DjC,gBAAgB,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA;IASjC,qBAAqB,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA,EAAE,KAAK,KAAA,EAAE,KAAK,KAAA;IAuDpD,UAAU,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA;IAK3B,UAAU,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA;IAS3B,QAAQ,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA;IASzB,SAAS,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA;IAQ1B,WAAW,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA,EAAE,eAAe,UAAQ,EAAE,gBAAgB,UAAQ;IAmB/E,cAAc,CAAC,IAAI,KAAA;IAMnB,gBAAgB,CAAC,IAAI,KAAA;IAOrB,YAAY,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA,EAAE,eAAe,KAAA;IAS9C,oBAAoB,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA;IAiBrC,uBAAuB,CAAC,CAAC,KAAA,EAAE,CAAC,KAAA;IAI5B,kBAAkB,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA;IAWnC,qBAAqB,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA;CAqCvC"}
+{"version":3,"file":"tileset-traverser.d.ts","sourceRoot":"","sources":["../../../src/tileset/traversers/tileset-traverser.ts"],"names":[],"mappings":"AAAA,OAAO,YAAY,MAAM,2BAA2B,CAAC;AAErD,OAAO,EAAC,UAAU,EAAC,MAAM,wBAAwB,CAAC;AAElD,oBAAY,qBAAqB,GAAG;IAClC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,cAAc,CAAC,EAAE,CAAC,UAAU,KAAA,KAAK,GAAG,CAAC;IACrC,qBAAqB,CAAC,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAC,CAAC;IAC7C,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,oBAAY,KAAK,GAAG;IAClB,YAAY,EAAE,OAAO,CAAC;IACtB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,gBAAgB,EAAE,OAAO,CAAC;IAC1B,uBAAuB,EAAE,MAAM,CAAC;IAChC,cAAc,EAAE,CAAC,UAAU,KAAA,KAAK,GAAG,CAAC;IACpC,qBAAqB,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAC,CAAC;IAC5C,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAQ3B,CAAC;AAEF,MAAM,CAAC,OAAO,OAAO,gBAAgB;IACnC,OAAO,EAAE,KAAK,CAAC;IAEf,IAAI,EAAE,GAAG,CAAC;IACV,cAAc,EAAE,MAAM,CAAC;IACvB,aAAa,EAAE,MAAM,CAAC;IACtB,UAAU,EAAE,MAAM,CAAC;IAEnB,SAAS,CAAC,UAAU,EAAE,MAAM,CAAwB;IACpD,SAAS,CAAC,QAAQ,CAAC,kBAAkB,QAAQ;IAC7C,SAAS,CAAC,eAAe,EAAE,YAAY,CAAC;IACxC,SAAS,CAAC,oBAAoB,EAAE,YAAY,CAAC;IAC7C,SAAS,CAAC,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAEtC,SAAS,KAAK,iBAAiB,IAAI,OAAO,CAEzC;gBAGW,OAAO,EAAE,qBAAqB;IAuB1C,QAAQ,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA,EAAE,OAAO,KAAA;IAclC,KAAK;IAgBL,gBAAgB,CAAC,IAAI,KAAA,EAAE,UAAU,EAAE,UAAU;IAmE7C,gBAAgB,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA;IASjC,qBAAqB,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA,EAAE,KAAK,KAAA,EAAE,KAAK,KAAA;IAuDpD,UAAU,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA;IAK3B,UAAU,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA;IAS3B,QAAQ,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA;IASzB,SAAS,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA;IAQ1B,WAAW,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA,EAAE,eAAe,UAAQ,EAAE,gBAAgB,UAAQ;IAmB/E,cAAc,CAAC,IAAI,KAAA;IAMnB,gBAAgB,CAAC,IAAI,KAAA;IAOrB,YAAY,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA,EAAE,eAAe,KAAA;IAS9C,oBAAoB,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA;IAiBrC,uBAAuB,CAAC,CAAC,KAAA,EAAE,CAAC,KAAA;IAI5B,kBAAkB,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA;IAWnC,qBAAqB,CAAC,IAAI,KAAA,EAAE,UAAU,KAAA;CAqCvC"}

package/dist/tileset/traversers/tileset-traverser.js

@@ -18,6 +18,8 @@ exports.DEFAULT_PROPS = {
 class TilesetTraverser {
     // TODO nested props
     constructor(options) {
+        this.lastUpdate = new Date().getTime();
+        this.updateDebounceTime = 1000;
         this.options = { ...exports.DEFAULT_PROPS, ...options };
         // TRAVERSAL
         // temporary storage to hold the traversed tiles during a traversal
@@ -35,6 +37,9 @@ class TilesetTraverser {
         // tiles does not have render content
         this.emptyTiles = {};
     }
+    get traversalFinished() {
+        return true;
+    }
     // tiles should be visible
     traverse(root, frameState, options) {
         this.root = root; // for root screen space error
@@ -110,7 +115,11 @@ class TilesetTraverser {
             // 4. update tile refine prop and parent refinement status to trickle down to the descendants
             tile._shouldRefine = shouldRefine && parentRefines;
         }
-        this.options.onTraversalEnd(frameState);
+        const newTime = new Date().getTime();
+        if (this.traversalFinished || newTime - this.lastUpdate > this.updateDebounceTime) {
+            this.lastUpdate = newTime;
+            this.options.onTraversalEnd(frameState);
+        }
     }
     updateChildTiles(tile, frameState) {
         const children = tile.children;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@loaders.gl/tiles",
-  "version": "3.1.7",
+  "version": "3.2.0-alpha.2",
   "description": "Common components for different tiles loaders.",
   "license": "MIT",
   "publishConfig": {
@@ -33,8 +33,8 @@
     "build-bundle": "esbuild src/bundle.ts --bundle --outfile=dist/dist.min.js"
   },
   "dependencies": {
-    "@loaders.gl/loader-utils": "3.1.7",
-    "@loaders.gl/math": "3.1.7",
+    "@loaders.gl/loader-utils": "3.2.0-alpha.2",
+    "@loaders.gl/math": "3.2.0-alpha.2",
     "@math.gl/core": "^3.5.1",
     "@math.gl/culling": "^3.5.1",
     "@math.gl/geospatial": "^3.5.1",
@@ -42,7 +42,7 @@
     "@probe.gl/stats": "^3.5.0"
   },
   "peerDependencies": {
-    "@loaders.gl/core": "^3.1.0"
+    "@loaders.gl/core": "3.2.0-alpha.1"
   },
-  "gitHead": "e48d29e426e9f23879875763e73efc5c58345be1"
+  "gitHead": "52a602739cbfce60fc314f474efc984d199dff78"
 }

package/src/tileset/helpers/frame-state.ts

@@ -1,3 +1,4 @@
+import {Tile3D} from '@loaders.gl/tiles';
 import {Vector3} from '@math.gl/core';
 import {CullingVolume, Plane} from '@math.gl/culling';
 import {Ellipsoid} from '@math.gl/geospatial';
@@ -9,6 +10,7 @@ export type FrameState = {
     up: number[];
   };
   viewport: {[key: string]: any};
+  topDownViewport: {[key: string]: any}; // Use it to calculate projected radius for a tile
   height: number;
   cullingVolume: CullingVolume;
   frameNumber: number; // TODO: This can be the same between updates, what number is unique for between updates?
@@ -60,6 +62,19 @@ export function getFrameState(viewport, frameNumber: number): FrameState {
 
   commonSpacePlanesToWGS84(viewport, viewportCenterCartesian);
 
+  const ViewportClass = viewport.constructor;
+  const {longitude, latitude, width, bearing, zoom} = viewport;
+  // @ts-ignore
+  const topDownViewport = new ViewportClass({
+    longitude,
+    latitude,
+    height,
+    width,
+    bearing,
+    zoom,
+    pitch: 0
+  });
+
   // TODO: make a file/class for frameState and document what needs to be attached to this so that traversal can function
   return {
     camera: {
@@ -68,6 +83,7 @@ export function getFrameState(viewport, frameNumber: number): FrameState {
       up: cameraUpCartesian
     },
     viewport,
+    topDownViewport,
     height,
     cullingVolume,
     frameNumber, // TODO: This can be the same between updates, what number is unique for between updates?
@@ -75,6 +91,46 @@ export function getFrameState(viewport, frameNumber: number): FrameState {
   };
 }
 
+/**
+ * Limit `tiles` array length with `maximumTilesSelected` number.
+ * The criteria for this filtering is distance of a tile center
+ * to the `frameState.viewport`'s longitude and latitude
+ * @param tiles - tiles array to filter
+ * @param frameState - frameState to calculate distances
+ * @param maximumTilesSelected - maximal amount of tiles in the output array
+ * @returns new tiles array
+ */
+export function limitSelectedTiles(
+  tiles: Tile3D[],
+  frameState: FrameState,
+  maximumTilesSelected: number
+): [Tile3D[], Tile3D[]] {
+  if (maximumTilesSelected === 0 || tiles.length <= maximumTilesSelected) {
+    return [tiles, []];
+  }
+  // Accumulate distances in couples array: [tileIndex: number, distanceToViewport: number]
+  const tuples: [number, number][] = [];
+  const {longitude: viewportLongitude, latitude: viewportLatitude} = frameState.viewport;
+  for (const [index, tile] of tiles.entries()) {
+    const [longitude, latitude] = tile.header.mbs;
+    const deltaLon = Math.abs(viewportLongitude - longitude);
+    const deltaLat = Math.abs(viewportLatitude - latitude);
+    const distance = Math.sqrt(deltaLat * deltaLat + deltaLon * deltaLon);
+    tuples.push([index, distance]);
+  }
+  const tuplesSorted = tuples.sort((a, b) => a[1] - b[1]);
+  const selectedTiles: Tile3D[] = [];
+  for (let i = 0; i < maximumTilesSelected; i++) {
+    selectedTiles.push(tiles[tuplesSorted[i][0]]);
+  }
+  const unselectedTiles: Tile3D[] = [];
+  for (let i = maximumTilesSelected; i < tuplesSorted.length; i++) {
+    unselectedTiles.push(tiles[tuplesSorted[i][0]]);
+  }
+
+  return [selectedTiles, unselectedTiles];
+}
+
 function commonSpacePlanesToWGS84(viewport, viewportCenterCartesian) {
   // Extract frustum planes based on current view.
   const frustumPlanes = viewport.getFrustumPlanes();