ImageOverlayPlugin: Delete only tile data associated with the tile set (#1403)

* ImageOverlayPlugin: Save actively used tiles

* Only delete overlay info for the relevant processed tiles

* Update events, fix non renderable tiles marking images to load

* Fix event

* Remove unused variable

Author: gkjohnson

src/core/renderer/tiles/TilesRendererBase.js

@@ -961,7 +961,7 @@ export class TilesRendererBase {
 			}
 
 			const res = this.invokeOnePlugin( plugin => plugin.fetchData && plugin.fetchData( uri, { ...this.fetchOptions, signal } ) );
-			this.dispatchEvent( { type: 'tile-download-start', tile } );
+			this.dispatchEvent( { type: 'tile-download-start', tile, uri } );
 			return res;
 
 		} )
@@ -1075,6 +1075,7 @@ export class TilesRendererBase {
 						type: 'load-model',
 						scene: tile.cached.scene,
 						tile,
+						url: uri,
 					} );
 
 				}

src/three/plugins/images/ImageOverlayPlugin.js

@@ -150,6 +150,7 @@ export class ImageOverlayPlugin {
 		this.usedTextures = new Set();
 		this.meshParams = new WeakMap();
 		this.pendingTiles = new Map();
+		this.processedTiles = new Set();
 		this.processQueue = null;
 		this._onUpdateAfter = null;
 		this._onTileDownloadStart = null;
@@ -284,9 +285,15 @@ export class ImageOverlayPlugin {
 
 		};
 
-		this._onTileDownloadStart = ( { tile } ) => {
+		this._onTileDownloadStart = ( { tile, url } ) => {
 
-			this._initTileOverlayInfo( tile );
+			// TODO: it would be better if there were either a separate event or flag indicating that a tile is an external
+			// tileset or not. We won't want to run "init" on tiles that have geometry.
+			if ( ! /\.json$/.test( url ) ) {
+
+				this._initTileOverlayInfo( tile );
+
+			}
 
 		};
 
@@ -303,7 +310,9 @@ export class ImageOverlayPlugin {
 
 	disposeTile( tile ) {
 
-		const { overlayInfo, tileControllers, processQueue, pendingTiles } = this;
+		const { overlayInfo, tileControllers, processQueue, pendingTiles, processedTiles } = this;
+
+		processedTiles.delete( tile );
 
 		// Cancel any ongoing tasks. If a tile is cancelled while downloading
 		// this will not have been created, yet.
@@ -401,25 +410,30 @@ export class ImageOverlayPlugin {
 
 	async _processTileModel( scene, tile, initialization = false ) {
 
-		this.tileControllers.set( tile, new AbortController() );
+		const { tileControllers, processedTiles, pendingTiles } = this;
+
+		tileControllers.set( tile, new AbortController() );
 
 		if ( ! initialization ) {
 
 			// we save all these pending tiles so that they can be correctly initialized if an
 			// overlay is added in the time between when this function starts and after the async
 			// await call. Otherwise the tile could be missed. But if we're initializing the plugin
 			// then we don't need to do this because the tiles are already included in the traversal.
-			this.pendingTiles.set( tile, scene );
+			pendingTiles.set( tile, scene );
 
 		}
 
+		// track which tiles we have been processed and remove them in "disposeTile"
+		processedTiles.add( tile );
+
 		this._wrapMaterials( scene );
 		this._initTileOverlayInfo( tile );
 		await this._initTileSceneOverlayInfo( scene, tile );
 		this.expandVirtualChildren( scene, tile );
 		this._updateLayers( tile );
 
-		this.pendingTiles.delete( tile );
+		pendingTiles.delete( tile );
 
 	}
 
@@ -887,13 +901,23 @@ export class ImageOverlayPlugin {
 
 	deleteOverlay( overlay ) {
 
-		const { overlays, overlayInfo, processQueue } = this;
+		const { overlays, overlayInfo, processQueue, processedTiles } = this;
 		const index = overlays.indexOf( overlay );
 		if ( index !== - 1 ) {
 
 			// delete tile info explicitly instead of blindly dispose of the full overlay
 			const { tileInfo, controller } = overlayInfo.get( overlay );
-			tileInfo.forEach( ( { meshInfo, range, meshRange, level, target, meshRangeMarked, rangeMarked }, tile ) => {
+			processedTiles.forEach( tile => {
+
+				const {
+					meshInfo,
+					range,
+					meshRange,
+					level,
+					target,
+					meshRangeMarked,
+					rangeMarked,
+				} = tileInfo.get( tile );
 
 				// release the ranges
 				if ( meshRange !== null && meshRangeMarked ) {

src/three/renderer/tiles/TilesRenderer.d.ts

@@ -12,9 +12,9 @@ export interface TilesRendererEventMap {
 	'load-tile-set': { tileset: object, /* @deprecated Use tileset instead */ tileSet?: object, url: string };
 	'tiles-load-start': {};
 	'tiles-load-end': {};
-	'tile-download-start': { tile: Tile };
+	'tile-download-start': { tile: Tile, url: string };
 	'load-content': {};
-	'load-model': { scene: Object3D; tile: Tile };
+	'load-model': { scene: Object3D; tile: Tile, url: string };
 	'dispose-model': { scene: Object3D; tile: Tile };
 	'tile-visibility-change': { scene: Object3D; tile: Tile; visible: boolean };
 	'update-before': {};