Working

src/plugins/three/fade/FadeBatchedMesh.js

@@ -9,50 +9,58 @@ export class FadeBatchedMesh extends PassThroughBatchedMesh {
 
 		super( ...args );
 
-		this.fadeTexture = null;
-		this._initFadeTexture();
-
 		const material = this.material;
 		const params = wrapFadeMaterial( material, material.onBeforeCompile );
-		params.fadeTexture.value = this.fadeTexture;
 		material.defines.FEATURE_FADE = 1;
 		material.defines.USE_BATCHING_FRAG = 1;
 		material.needsUpdate = true;
 
+		this.fadeTexture = null;
+		this._fadeParams = params;
+
+		this._initFadeTexture();
+
+
+	}
+
+	setFadeAt( index, fadeIn, fadeOut ) {
+
+		this._initFadeTexture();
+		this.fadeTexture.setValueAt( index, fadeIn, fadeOut );
+
 	}
 
 	_initFadeTexture() {
 
 		let size = Math.sqrt( this._maxInstanceCount );
 		size = Math.ceil( size );
 
-		// 4 floats per RGBA pixel initialized to white
-		const fadeArray = new Float32Array( size * size * 2 ).fill( 1 );
-		const fadeTexture = new InstanceDataTexture( fadeArray, size, size, RGFormat, FloatType );
+		const oldFadeTexture = this.fadeTexture;
+		if ( ! this.fadeTexture || this.fadeTexture.image.data.length !== size * size * 2 ) {
 
-		this.fadeTexture = fadeTexture;
+			// 4 floats per RGBA pixel initialized to white
+			const fadeArray = new Float32Array( size * size * 2 );
+			const fadeTexture = new InstanceDataTexture( fadeArray, size, size, RGFormat, FloatType );
 
-	}
+			if ( oldFadeTexture ) {
 
-	setInstanceCount( ...args ) {
+				const src = oldFadeTexture.image.data;
+				const dst = this.fadeTexture.image.data;
+				const len = Math.min( src.length, dst.length );
+				dst.set( new src.constructor( src.buffer, 0, len ) );
 
-		super.setInstanceCount( ...args );
+			}
 
-		// update texture data for instance sampling
-		const oldFadeTexture = this.fadeTexture;
-		oldFadeTexture.dispose();
-		this._initFadeTexture();
+			this.fadeTexture = fadeTexture;
+			this._fadeParams.fadeTexture.value = fadeTexture;
+			fadeTexture.needsUpdate = true;
 
-		const src = oldFadeTexture.image.data;
-		const dst = this.fadeTexture.image.data;
-		const len = Math.min( src.length, dst.length );
-		dst.set( new src.constructor( src.buffer, 0, len ) );
+		}
 
 	}
 
 	dispose() {
 
-		super.dispose();
 		this.fadeTexture.dispose();
 
 	}

src/plugins/three/fade/PassThroughBatchedMesh.js

@@ -10,7 +10,6 @@ export class PassThroughBatchedMesh {
 		this.visible = true;
 		this.parent = null;
 		this._instanceInfo = [];
-		this._availableInstanceIds = [];
 		this._visibilityChanged = true;
 
 		const proxyTarget = new Proxy( this, {

src/plugins/three/fade/TilesFadePlugin.js

@@ -39,7 +39,6 @@ function onTileVisibilityChange( tile, visible ) {
 
 			tile[ HAS_POPPED_IN ] = true;
 
-
 		} else {
 
 			this._fadeManager.fadeIn( tile );
@@ -223,19 +222,25 @@ function onUpdateAfter() {
 		lruCache.markUsed( tile );
 		fadeMaterialManager.setFade( tile.cached.scene, fadeIn, fadeOut );
 
-		const isFading = fadeIn !== 0 && fadeIn !== 1 || fadeOut !== 0 && fadeIn !== 1;
-		this.forEachBatchIds( tile, ( id, batchedMesh ) => {
-
-			if ( isFading ) {
+		const isFading = fadeManager.isFading( tile );
+		this.forEachBatchIds( tile, ( id, batchedMesh, plugin ) => {
 
-				batchedMesh.fadeTexture.setValueAt( id, fadeIn, fadeOut );
-
-			}
+			batchedMesh.setFadeAt( id, fadeIn, fadeOut );
+			batchedMesh.setVisibleAt( id, isFading );
+			plugin.batchedMesh.setVisibleAt( id, ! isFading );
 
 		} );
 
 	} );
 
+	if ( this.batchedMesh ) {
+
+		const material = this.tiles.getPluginByName( 'BATCHED_MESH_PLUGIN' ).batchedMesh.material;
+		this.batchedMesh.material.map = material.map;
+		this.batchedMesh.material.needsUpdate = true;
+
+	}
+
 }
 
 export class TilesFadePlugin {
@@ -339,7 +344,8 @@ export class TilesFadePlugin {
 
 			this.forEachBatchIds( tile, ( id, batchedMesh, plugin ) => {
 
-				batchedMesh.setVisibleAt( id, visible );
+				batchedMesh.setFadeAt( id, 0, 0 );
+				batchedMesh.setVisibleAt( id, true );
 				plugin.batchedMesh.setVisibleAt( id, false );
 
 			} );