WebGLRenderer: Always generate mipmaps when "generateMipmaps" is true. (#29677)

* Always generate mipmaps when "generateMipmaps" is true.

* Update HTML examples

* More examples

* Update loaders

* Fix GLTF loader

* Update WebGPURenderer

* Remove unused constants

* Update bindings file to remove unnecessary mipmaps check

examples/jsm/interactive/HTMLMesh.js

@@ -62,6 +62,7 @@ class HTMLTexture extends CanvasTexture {
 		this.colorSpace = SRGBColorSpace;
 		this.minFilter = LinearFilter;
 		this.magFilter = LinearFilter;
+		this.generateMipmaps = false;
 
 		// Create an observer on the DOM, and run html2canvas update in the next loop
 		const observer = new MutationObserver( () => {

examples/jsm/loaders/3DMLoader.js

@@ -745,6 +745,7 @@ class Rhino3dmLoader extends Loader {
 
 				const texture = new CanvasTexture( ctx.canvas );
 				texture.minFilter = LinearFilter;
+				texture.generateMipmaps = false;
 				texture.wrapS = ClampToEdgeWrapping;
 				texture.wrapT = ClampToEdgeWrapping;
 

examples/jsm/loaders/3MFLoader.js

@@ -386,7 +386,7 @@ class ThreeMFLoader extends Loader {
 
 					const attrib = portNodes[ i ].attributes[ j ];
 					if ( attrib.specified ) {
-		 				args[ attrib.name ] = attrib.value; 
+		 				args[ attrib.name ] = attrib.value;
 					}
 				}
 
@@ -929,11 +929,13 @@ class ThreeMFLoader extends Loader {
 					case 'linear':
 						texture.magFilter = LinearFilter;
 						texture.minFilter = LinearFilter;
+						texture.generateMipmaps = false;
 						break;
 
 					case 'nearest':
 						texture.magFilter = NearestFilter;
 						texture.minFilter = NearestFilter;
+						texture.generateMipmaps = false;
 						break;
 
 					default:

examples/jsm/loaders/GLTFLoader.js

@@ -3230,6 +3230,7 @@ class GLTFParser {
 			texture.minFilter = WEBGL_FILTERS[ sampler.minFilter ] || LinearMipmapLinearFilter;
 			texture.wrapS = WEBGL_WRAPPINGS[ sampler.wrapS ] || RepeatWrapping;
 			texture.wrapT = WEBGL_WRAPPINGS[ sampler.wrapT ] || RepeatWrapping;
+			texture.generateMipmaps = texture.minFilter !== NearestFilter && texture.minFilter !== LinearFilter;
 
 			parser.associations.set( texture, { textures: textureIndex } );
 

examples/jsm/loaders/LottieLoader.js

@@ -22,6 +22,7 @@ class LottieLoader extends Loader {
 
 		const texture = new CanvasTexture();
 		texture.minFilter = NearestFilter;
+		texture.generateMipmaps = false;
 		texture.colorSpace = SRGBColorSpace;
 
 		const loader = new FileLoader( this.manager );

examples/jsm/loaders/MMDLoader.js

@@ -1467,6 +1467,7 @@ class MaterialBuilder {
 
 				t.magFilter = NearestFilter;
 				t.minFilter = NearestFilter;
+				t.generateMipmaps = false;
 
 			}
 

examples/jsm/misc/VolumeSlice.js

@@ -68,6 +68,7 @@ class VolumeSlice {
 
 		const canvasMap = new Texture( this.canvas );
 		canvasMap.minFilter = LinearFilter;
+		canvasMap.generateMipmaps = false;
 		canvasMap.wrapS = canvasMap.wrapT = ClampToEdgeWrapping;
 		canvasMap.colorSpace = SRGBColorSpace;
 		const material = new MeshBasicMaterial( { map: canvasMap, side: DoubleSide, transparent: true } );

examples/webgl_depth_texture.html

@@ -148,6 +148,7 @@
 				target = new THREE.WebGLRenderTarget( window.innerWidth * dpr, window.innerHeight * dpr );
 				target.texture.minFilter = THREE.NearestFilter;
 				target.texture.magFilter = THREE.NearestFilter;
+				target.texture.generateMipmaps = false;
 				target.stencilBuffer = ( format === THREE.DepthStencilFormat ) ? true : false;
 				target.samples = samples;
 

examples/webgl_lights_spotlight.html

@@ -77,6 +77,7 @@
 					const texture = loader.load( filename );
 					texture.minFilter = THREE.LinearFilter;
 					texture.magFilter = THREE.LinearFilter;
+					texture.generateMipmaps = false;
 					texture.colorSpace = THREE.SRGBColorSpace;
 
 					textures[ filename ] = texture;

examples/webgl_materials_texture_filters.html

@@ -109,6 +109,7 @@
 				const textureCanvas2 = textureCanvas.clone();
 				textureCanvas2.magFilter = THREE.NearestFilter;
 				textureCanvas2.minFilter = THREE.NearestFilter;
+				textureCanvas2.generateMipmaps = false;
 
 				const materialCanvas = new THREE.MeshBasicMaterial( { map: textureCanvas } );
 				const materialCanvas2 = new THREE.MeshBasicMaterial( { color: 0xffccaa, map: textureCanvas2 } );

examples/webgl_postprocessing_masking.html

@@ -68,6 +68,7 @@
 				const texture1 = new THREE.TextureLoader().load( 'textures/758px-Canestra_di_frutta_(Caravaggio).jpg' );
 				texture1.colorSpace = THREE.SRGBColorSpace;
 				texture1.minFilter = THREE.LinearFilter;
+				texture1.generateMipmaps = false;
 				const texture2 = new THREE.TextureLoader().load( 'textures/2294472375_24a3b8ef46_o.jpg' );
 				texture2.colorSpace = THREE.SRGBColorSpace;
 

examples/webgl_video_kinect.html

@@ -110,6 +110,7 @@
 
 				const texture = new THREE.VideoTexture( video );
 				texture.minFilter = THREE.NearestFilter;
+				texture.generateMipmaps = false;
 
 				const width = 640, height = 480;
 				const nearClipping = 850, farClipping = 4000;

examples/webgpu_compute_particles_rain.html

@@ -87,6 +87,7 @@
 				collisionPosRT.texture.type = THREE.HalfFloatType;
 				collisionPosRT.texture.magFilter = THREE.NearestFilter;
 				collisionPosRT.texture.minFilter = THREE.NearestFilter;
+				collisionPosRT.texture.generateMipmaps = false;
 
 				collisionPosMaterial = new THREE.MeshBasicNodeMaterial();
 				collisionPosMaterial.colorNode = positionWorld;

examples/webgpu_compute_particles_snow.html

@@ -85,6 +85,7 @@
 				collisionPosRT.texture.type = THREE.HalfFloatType;
 				collisionPosRT.texture.magFilter = THREE.NearestFilter;
 				collisionPosRT.texture.minFilter = THREE.NearestFilter;
+				collisionPosRT.texture.generateMipmaps = false;
 
 				collisionPosMaterial = new THREE.MeshBasicNodeMaterial();
 				collisionPosMaterial.fog = false;

examples/webgpu_postprocessing_masking.html

@@ -53,6 +53,7 @@
 				const texture1 = new THREE.TextureLoader().load( 'textures/758px-Canestra_di_frutta_(Caravaggio).jpg' );
 				texture1.colorSpace = THREE.SRGBColorSpace;
 				texture1.minFilter = THREE.LinearFilter;
+				texture1.generateMipmaps = false;
 				texture1.flipY = false;
 
 				const texture2 = new THREE.TextureLoader().load( 'textures/2294472375_24a3b8ef46_o.jpg' );
@@ -116,4 +117,4 @@
 
 		</script>
 	</body>
-</html>
+</html>

src/renderers/common/Bindings.js

@@ -177,7 +177,7 @@ class Bindings extends DataMap {
 
 						textureData.needsMipmap = true;
 
-					} else if ( texture.generateMipmaps === true && this.textures.needsMipmaps( texture ) && textureData.needsMipmap === true ) {
+					} else if ( this.textures.needsMipmaps( texture ) && textureData.needsMipmap === true ) {
 
 						this.backend.generateMipmaps( texture );
 

src/renderers/common/Textures.js

@@ -2,7 +2,7 @@ import DataMap from './DataMap.js';
 
 import { Vector3 } from '../../math/Vector3.js';
 import { DepthTexture } from '../../textures/DepthTexture.js';
-import { DepthStencilFormat, DepthFormat, UnsignedIntType, UnsignedInt248Type, LinearFilter, NearestFilter, EquirectangularReflectionMapping, EquirectangularRefractionMapping, CubeReflectionMapping, CubeRefractionMapping, UnsignedByteType } from '../../constants.js';
+import { DepthStencilFormat, DepthFormat, UnsignedIntType, UnsignedInt248Type, EquirectangularReflectionMapping, EquirectangularRefractionMapping, CubeReflectionMapping, CubeRefractionMapping, UnsignedByteType } from '../../constants.js';
 
 const _size = /*@__PURE__*/ new Vector3();
 
@@ -335,9 +335,7 @@ class Textures extends DataMap {
 
 	needsMipmaps( texture ) {
 
-		if ( this.isEnvironmentTexture( texture ) ) return true;
-
-		return ( texture.isCompressedTexture === true ) || ( ( texture.minFilter !== NearestFilter ) && ( texture.minFilter !== LinearFilter ) );
+		return this.isEnvironmentTexture( texture ) || texture.isCompressedTexture === true || texture.generateMipmaps;
 
 	}
 

src/renderers/webgl/WebGLTextures.js

@@ -107,7 +107,7 @@ function WebGLTextures( _gl, extensions, state, properties, capabilities, utils,
 
 	function textureNeedsGenerateMipmaps( texture ) {
 
-		return texture.generateMipmaps && texture.minFilter !== NearestFilter && texture.minFilter !== LinearFilter;
+		return texture.generateMipmaps;
 
 	}