From deca60e3e7316fe411428f2165aee9a4852608e8 Mon Sep 17 00:00:00 2001 From: Emmett Lalish Date: Wed, 18 Dec 2024 16:10:18 -0800 Subject: [PATCH 01/10] factor out sampler --- src/nodes/pmrem/PMREMUtils.js | 66 +++++++++++++++++-- src/renderers/common/CubeRenderTarget.js | 29 ++++++++ src/renderers/common/extras/PMREMGenerator.js | 14 ++-- 3 files changed, 95 insertions(+), 14 deletions(-) diff --git a/src/nodes/pmrem/PMREMUtils.js b/src/nodes/pmrem/PMREMUtils.js index cb7c7c43d4fc3b..7246a7d574401f 100644 --- a/src/nodes/pmrem/PMREMUtils.js +++ b/src/nodes/pmrem/PMREMUtils.js @@ -214,7 +214,7 @@ export const textureCubeUV = /*@__PURE__*/ Fn( ( [ envMap, sampleDir_immutable, } ); -const bilinearCubeUV = /*@__PURE__*/ Fn( ( [ envMap, direction_immutable, mipInt_immutable, CUBEUV_TEXEL_WIDTH, CUBEUV_TEXEL_HEIGHT, CUBEUV_MAX_MIP ] ) => { +export const bilinearCubeUV = /*@__PURE__*/ Fn( ( [ envMap, direction_immutable, mipInt_immutable, CUBEUV_TEXEL_WIDTH, CUBEUV_TEXEL_HEIGHT, CUBEUV_MAX_MIP ] ) => { const mipInt = float( mipInt_immutable ).toVar(); const direction = vec3( direction_immutable ); @@ -241,7 +241,7 @@ const bilinearCubeUV = /*@__PURE__*/ Fn( ( [ envMap, direction_immutable, mipInt } ); -const getSample = /*@__PURE__*/ Fn( ( { envMap, mipInt, outputDirection, theta, axis, CUBEUV_TEXEL_WIDTH, CUBEUV_TEXEL_HEIGHT, CUBEUV_MAX_MIP } ) => { +const getSample = /*@__PURE__*/ Fn( ( { envMap, outputDirection, theta, axis, sampler } ) => { const cosTheta = cos( theta ); @@ -250,11 +250,11 @@ const getSample = /*@__PURE__*/ Fn( ( { envMap, mipInt, outputDirection, theta, .add( axis.cross( outputDirection ).mul( sin( theta ) ) ) .add( axis.mul( axis.dot( outputDirection ).mul( cosTheta.oneMinus() ) ) ); - return bilinearCubeUV( envMap, sampleDirection, mipInt, CUBEUV_TEXEL_WIDTH, CUBEUV_TEXEL_HEIGHT, CUBEUV_MAX_MIP ); + return sampler( envMap, sampleDirection ); } ); -export const blur = /*@__PURE__*/ Fn( ( { n, latitudinal, poleAxis, outputDirection, weights, samples, dTheta, mipInt, envMap, CUBEUV_TEXEL_WIDTH, CUBEUV_TEXEL_HEIGHT, CUBEUV_MAX_MIP } ) => { +export const blur = /*@__PURE__*/ Fn( ( { n, latitudinal, poleAxis, outputDirection, weights, samples, dTheta, envMap, sampler } ) => { const axis = vec3( select( latitudinal, poleAxis, cross( poleAxis, outputDirection ) ) ).toVar(); @@ -267,7 +267,7 @@ export const blur = /*@__PURE__*/ Fn( ( { n, latitudinal, poleAxis, outputDirect axis.assign( normalize( axis ) ); const gl_FragColor = vec3().toVar(); - gl_FragColor.addAssign( weights.element( int( 0 ) ).mul( getSample( { theta: 0.0, axis, outputDirection, mipInt, envMap, CUBEUV_TEXEL_WIDTH, CUBEUV_TEXEL_HEIGHT, CUBEUV_MAX_MIP } ) ) ); + gl_FragColor.addAssign( weights.element( int( 0 ) ).mul( getSample( { theta: 0.0, axis, outputDirection, envMap, sampler } ) ) ); Loop( { start: int( 1 ), end: n }, ( { i } ) => { @@ -278,11 +278,63 @@ export const blur = /*@__PURE__*/ Fn( ( { n, latitudinal, poleAxis, outputDirect } ); const theta = float( dTheta.mul( float( i ) ) ).toVar(); - gl_FragColor.addAssign( weights.element( i ).mul( getSample( { theta: theta.mul( - 1.0 ), axis, outputDirection, mipInt, envMap, CUBEUV_TEXEL_WIDTH, CUBEUV_TEXEL_HEIGHT, CUBEUV_MAX_MIP } ) ) ); - gl_FragColor.addAssign( weights.element( i ).mul( getSample( { theta, axis, outputDirection, mipInt, envMap, CUBEUV_TEXEL_WIDTH, CUBEUV_TEXEL_HEIGHT, CUBEUV_MAX_MIP } ) ) ); + gl_FragColor.addAssign( weights.element( i ).mul( getSample( { theta: theta.mul( - 1.0 ), axis, outputDirection, envMap, sampler } ) ) ); + gl_FragColor.addAssign( weights.element( i ).mul( getSample( { theta, axis, outputDirection, envMap, sampler } ) ) ); } ); return vec4( gl_FragColor, 1 ); } ); + +export const getBlurParams=(sigmaRadians, cubeRes, maxSamples)=>{ + // Number of standard deviations at which to cut off the discrete approximation. + const STANDARD_DEVIATIONS = 3; + + const radiansPerPixel = Math.PI / ( 2 * cubeRes ); + const sigmaPixels = sigmaRadians / radiansPerPixel; + const samples =1 + Math.floor( STANDARD_DEVIATIONS * sigmaPixels ); + + if ( samples > maxSamples ) { + + console.warn( `sigmaRadians, ${ + sigmaRadians}, is too large and will clip, as it requested ${ + samples} samples when the maximum is set to ${maxSamples}` ); + + } + + const weights = []; + let sum = 0; + + for ( let i = 0; i < maxSamples; ++ i ) { + + if(i>=samples){ + weights.push(0); + continue; + } + + const x = i / sigmaPixels; + const weight = Math.exp( - x * x / 2 ); + weights.push( weight ); + + if ( i === 0 ) { + + sum += weight; + + } else { + + sum += 2 * weight; + + } + + } + + for ( let i = 0; i < weights.length; i ++ ) { + + weights[ i ] = weights[ i ] / sum; + + } + + return {radiansPerPixel, samples, weights}; + +}; diff --git a/src/renderers/common/CubeRenderTarget.js b/src/renderers/common/CubeRenderTarget.js index 29bd3a6fbc7822..186ab53d6f7f3d 100644 --- a/src/renderers/common/CubeRenderTarget.js +++ b/src/renderers/common/CubeRenderTarget.js @@ -9,6 +9,7 @@ import { CubeCamera } from '../../cameras/CubeCamera.js'; import { BoxGeometry } from '../../geometries/BoxGeometry.js'; import { Mesh } from '../../objects/Mesh.js'; import { BackSide, NoBlending, LinearFilter, LinearMipmapLinearFilter } from '../../constants.js'; +import {cubeTexture as TSL_CubeTexture} from '../../nodes/accessors/CubeTextureNode.js'; // @TODO: Consider rename WebGLCubeRenderTarget to just CubeRenderTarget @@ -72,6 +73,34 @@ class CubeRenderTarget extends WebGLCubeRenderTarget { } + fromBlur(renderer, cubeMap, sigma){ + const blurTarget1=new CubeRenderTarget(this.width); + + const geometry = new BoxGeometry( 5, 5, 5 ); + + const blurMaterial = new NodeMaterial(); + blurMaterial.colorNode = TSL_CubeTexture(cubeMap, positionWorldDirection, 0); + blurMaterial.side = BackSide; + blurMaterial.depthTest = false; + blurMaterial.depthWrite = false; + blurMaterial.blending = NoBlending; + + const mesh = new Mesh( geometry, blurMaterial ); + + const scene = new Scene(); + scene.add( mesh ); + + const camera = new CubeCamera( 1, 10, blurTarget1 ); + + camera.update( renderer, scene ); + + camera.renderTarget=this; + + camera.update( renderer, scene ); + + blurTarget1.dispose(); + } + } export default CubeRenderTarget; diff --git a/src/renderers/common/extras/PMREMGenerator.js b/src/renderers/common/extras/PMREMGenerator.js index 110bc0f7639053..d96d3cd4c55ddb 100644 --- a/src/renderers/common/extras/PMREMGenerator.js +++ b/src/renderers/common/extras/PMREMGenerator.js @@ -1,11 +1,11 @@ import NodeMaterial from '../../../materials/nodes/NodeMaterial.js'; -import { getDirection, blur } from '../../../nodes/pmrem/PMREMUtils.js'; +import { getDirection, blur, bilinearCubeUV } from '../../../nodes/pmrem/PMREMUtils.js'; import { equirectUV } from '../../../nodes/utils/EquirectUVNode.js'; import { uniform } from '../../../nodes/core/UniformNode.js'; import { uniformArray } from '../../../nodes/accessors/UniformArrayNode.js'; import { texture } from '../../../nodes/accessors/TextureNode.js'; import { cubeTexture } from '../../../nodes/accessors/CubeTextureNode.js'; -import { float, vec3 } from '../../../nodes/tsl/TSLBase.js'; +import { float, vec3, Fn } from '../../../nodes/tsl/TSLBase.js'; import { uv } from '../../../nodes/accessors/UV.js'; import { attribute } from '../../../nodes/core/AttributeNode.js'; @@ -736,15 +736,15 @@ function _getBlurShader( lodMax, width, height ) { dTheta, samples, envMap, - mipInt, - CUBEUV_TEXEL_WIDTH, - CUBEUV_TEXEL_HEIGHT, - CUBEUV_MAX_MIP + mipInt }; const material = _getMaterial( 'blur' ); material.uniforms = materialUniforms; // TODO: Move to outside of the material - material.fragmentNode = blur( { ...materialUniforms, latitudinal: latitudinal.equal( 1 ) } ); + const cubeUVsampler=Fn((envMap, sampleDirection)=>{ + return bilinearCubeUV( envMap, sampleDirection, mipInt, CUBEUV_TEXEL_WIDTH, CUBEUV_TEXEL_HEIGHT, CUBEUV_MAX_MIP ); + }); + material.fragmentNode = blur( { ...materialUniforms, latitudinal: latitudinal.equal( 1 ), sampler: cubeUVsampler } ); return material; From e87294d241ad14cd1925e1ab2e089ca1d1bc6b75 Mon Sep 17 00:00:00 2001 From: sunag Date: Wed, 18 Dec 2024 21:48:16 -0300 Subject: [PATCH 02/10] fixing parameters --- src/renderers/common/extras/PMREMGenerator.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/renderers/common/extras/PMREMGenerator.js b/src/renderers/common/extras/PMREMGenerator.js index 6c91d9c32270a1..13fd5ec9929d54 100644 --- a/src/renderers/common/extras/PMREMGenerator.js +++ b/src/renderers/common/extras/PMREMGenerator.js @@ -838,7 +838,8 @@ function _getBlurShader( lodMax, width, height ) { const material = _getMaterial( 'blur' ); material.uniforms = materialUniforms; // TODO: Move to outside of the material - const cubeUVsampler=Fn((envMap, sampleDirection)=>{ + const cubeUVsampler=Fn(( [ envMap, sampleDirection ] )=>{ + return bilinearCubeUV( envMap, sampleDirection, mipInt, CUBEUV_TEXEL_WIDTH, CUBEUV_TEXEL_HEIGHT, CUBEUV_MAX_MIP ); }); material.fragmentNode = blur( { ...materialUniforms, latitudinal: latitudinal.equal( 1 ), sampler: cubeUVsampler } ); From 1773a8f96f32ae43eb442c048eab705a0d254574 Mon Sep 17 00:00:00 2001 From: Emmett Lalish Date: Thu, 19 Dec 2024 09:18:02 -0800 Subject: [PATCH 03/10] further simplification --- src/nodes/pmrem/PMREMUtils.js | 12 ++++++------ src/renderers/common/extras/PMREMGenerator.js | 3 +-- 2 files changed, 7 insertions(+), 8 deletions(-) diff --git a/src/nodes/pmrem/PMREMUtils.js b/src/nodes/pmrem/PMREMUtils.js index 32325177796fd6..88196ca7e1661e 100644 --- a/src/nodes/pmrem/PMREMUtils.js +++ b/src/nodes/pmrem/PMREMUtils.js @@ -241,7 +241,7 @@ export const bilinearCubeUV = /*@__PURE__*/ Fn( ( [ envMap, direction_immutable, } ); -const getSample = /*@__PURE__*/ Fn( ( { envMap, outputDirection, theta, axis, sampler } ) => { +const getSample = /*@__PURE__*/ Fn( ( { outputDirection, theta, axis, sampler } ) => { const cosTheta = cos( theta ); @@ -250,11 +250,11 @@ const getSample = /*@__PURE__*/ Fn( ( { envMap, outputDirection, theta, axis, sa .add( axis.cross( outputDirection ).mul( sin( theta ) ) ) .add( axis.mul( axis.dot( outputDirection ).mul( cosTheta.oneMinus() ) ) ); - return sampler( envMap, sampleDirection ); + return sampler( sampleDirection ); } ); -export const blur = /*@__PURE__*/ Fn( ( { n, latitudinal, poleAxis, outputDirection, weights, samples, dTheta, envMap, sampler } ) => { +export const blur = /*@__PURE__*/ Fn( ( { n, latitudinal, poleAxis, outputDirection, weights, samples, dTheta, sampler } ) => { const axis = vec3( select( latitudinal, poleAxis, cross( poleAxis, outputDirection ) ) ).toVar(); @@ -267,7 +267,7 @@ export const blur = /*@__PURE__*/ Fn( ( { n, latitudinal, poleAxis, outputDirect axis.assign( normalize( axis ) ); const gl_FragColor = vec3().toVar(); - gl_FragColor.addAssign( weights.element( int( 0 ) ).mul( getSample( { theta: 0.0, axis, outputDirection, envMap, sampler } ) ) ); + gl_FragColor.addAssign( weights.element( int( 0 ) ).mul( getSample( { theta: 0.0, axis, outputDirection, sampler } ) ) ); Loop( { start: int( 1 ), end: n }, ( { i } ) => { @@ -278,8 +278,8 @@ export const blur = /*@__PURE__*/ Fn( ( { n, latitudinal, poleAxis, outputDirect } ); const theta = float( dTheta.mul( float( i ) ) ).toVar(); - gl_FragColor.addAssign( weights.element( i ).mul( getSample( { theta: theta.mul( - 1.0 ), axis, outputDirection, envMap, sampler } ) ) ); - gl_FragColor.addAssign( weights.element( i ).mul( getSample( { theta, axis, outputDirection, envMap, sampler } ) ) ); + gl_FragColor.addAssign( weights.element( i ).mul( getSample( { theta: theta.mul( - 1.0 ), axis, outputDirection, sampler } ) ) ); + gl_FragColor.addAssign( weights.element( i ).mul( getSample( { theta, axis, outputDirection, sampler } ) ) ); } ); diff --git a/src/renderers/common/extras/PMREMGenerator.js b/src/renderers/common/extras/PMREMGenerator.js index 13fd5ec9929d54..8a62ad2767bfbb 100644 --- a/src/renderers/common/extras/PMREMGenerator.js +++ b/src/renderers/common/extras/PMREMGenerator.js @@ -838,8 +838,7 @@ function _getBlurShader( lodMax, width, height ) { const material = _getMaterial( 'blur' ); material.uniforms = materialUniforms; // TODO: Move to outside of the material - const cubeUVsampler=Fn(( [ envMap, sampleDirection ] )=>{ - + const cubeUVsampler=Fn(( [ sampleDirection ] )=>{ return bilinearCubeUV( envMap, sampleDirection, mipInt, CUBEUV_TEXEL_WIDTH, CUBEUV_TEXEL_HEIGHT, CUBEUV_MAX_MIP ); }); material.fragmentNode = blur( { ...materialUniforms, latitudinal: latitudinal.equal( 1 ), sampler: cubeUVsampler } ); From 05da83fb74604811a8ae3fa02fb3ec00e71831ac Mon Sep 17 00:00:00 2001 From: Emmett Lalish Date: Thu, 19 Dec 2024 09:26:57 -0800 Subject: [PATCH 04/10] use getParams function --- src/renderers/common/extras/PMREMGenerator.js | 45 +------------------ 1 file changed, 2 insertions(+), 43 deletions(-) diff --git a/src/renderers/common/extras/PMREMGenerator.js b/src/renderers/common/extras/PMREMGenerator.js index 8a62ad2767bfbb..6bc307a0a1574a 100644 --- a/src/renderers/common/extras/PMREMGenerator.js +++ b/src/renderers/common/extras/PMREMGenerator.js @@ -1,5 +1,5 @@ import NodeMaterial from '../../../materials/nodes/NodeMaterial.js'; -import { getDirection, blur, bilinearCubeUV } from '../../../nodes/pmrem/PMREMUtils.js'; +import { getDirection, blur, bilinearCubeUV, getBlurParams } from '../../../nodes/pmrem/PMREMUtils.js'; import { equirectUV } from '../../../nodes/utils/EquirectUVNode.js'; import { uniform } from '../../../nodes/core/UniformNode.js'; import { uniformArray } from '../../../nodes/accessors/UniformArrayNode.js'; @@ -619,53 +619,12 @@ class PMREMGenerator { } - // Number of standard deviations at which to cut off the discrete approximation. - const STANDARD_DEVIATIONS = 3; - const blurMesh = this._lodMeshes[ lodOut ]; blurMesh.material = blurMaterial; const blurUniforms = blurMaterial.uniforms; - const pixels = this._sizeLods[ lodIn ] - 1; - const radiansPerPixel = isFinite( sigmaRadians ) ? Math.PI / ( 2 * pixels ) : 2 * Math.PI / ( 2 * MAX_SAMPLES - 1 ); - const sigmaPixels = sigmaRadians / radiansPerPixel; - const samples = isFinite( sigmaRadians ) ? 1 + Math.floor( STANDARD_DEVIATIONS * sigmaPixels ) : MAX_SAMPLES; - - if ( samples > MAX_SAMPLES ) { - - console.warn( `sigmaRadians, ${ - sigmaRadians}, is too large and will clip, as it requested ${ - samples} samples when the maximum is set to ${MAX_SAMPLES}` ); - - } - - const weights = []; - let sum = 0; - - for ( let i = 0; i < MAX_SAMPLES; ++ i ) { - - const x = i / sigmaPixels; - const weight = Math.exp( - x * x / 2 ); - weights.push( weight ); - - if ( i === 0 ) { - - sum += weight; - - } else if ( i < samples ) { - - sum += 2 * weight; - - } - - } - - for ( let i = 0; i < weights.length; i ++ ) { - - weights[ i ] = weights[ i ] / sum; - - } + const {radiansPerPixel, samples, weights}=getBlurParams(sigmaRadians, this._sizeLods[ lodIn ] - 1, MAX_SAMPLES); targetIn.texture.frame = ( targetIn.texture.frame || 0 ) + 1; From 4c777e8bef1497418b0741b26172a19a4f8c2be8 Mon Sep 17 00:00:00 2001 From: Emmett Lalish Date: Thu, 19 Dec 2024 11:53:03 -0800 Subject: [PATCH 05/10] completed fromBlur --- src/renderers/common/CubeRenderTarget.js | 39 +++++++++++++++++++++--- 1 file changed, 34 insertions(+), 5 deletions(-) diff --git a/src/renderers/common/CubeRenderTarget.js b/src/renderers/common/CubeRenderTarget.js index 186ab53d6f7f3d..17a2c5dae92910 100644 --- a/src/renderers/common/CubeRenderTarget.js +++ b/src/renderers/common/CubeRenderTarget.js @@ -2,6 +2,7 @@ import { equirectUV } from '../../nodes/utils/EquirectUVNode.js'; import { texture as TSL_Texture } from '../../nodes/accessors/TextureNode.js'; import { positionWorldDirection } from '../../nodes/accessors/Position.js'; import NodeMaterial from '../../materials/nodes/NodeMaterial.js'; +import { blur, getBlurParams } from '../../../nodes/pmrem/PMREMUtils.js'; import { WebGLCubeRenderTarget } from '../../renderers/WebGLCubeRenderTarget.js'; import { Scene } from '../../scenes/Scene.js'; @@ -73,32 +74,60 @@ class CubeRenderTarget extends WebGLCubeRenderTarget { } - fromBlur(renderer, cubeMap, sigma){ - const blurTarget1=new CubeRenderTarget(this.width); + fromBlur(renderer, cubeMap, sigmaRadians, poleAxis=new Vector3(0, 1, 0)){ + // The maximum length of the blur for loop. Smaller sigmas will use fewer + // samples and exit early, but not recompile the shader. + const MAX_SAMPLES = 20; + + const blurTarget=new CubeRenderTarget(Math.min(this.width, cubeMap.width)); const geometry = new BoxGeometry( 5, 5, 5 ); const blurMaterial = new NodeMaterial(); - blurMaterial.colorNode = TSL_CubeTexture(cubeMap, positionWorldDirection, 0); blurMaterial.side = BackSide; blurMaterial.depthTest = false; blurMaterial.depthWrite = false; blurMaterial.blending = NoBlending; + const weights = uniformArray( new Array( MAX_SAMPLES ).fill( 0 ) ); + const dTheta = uniform( 0 ); + const n = float( MAX_SAMPLES ); + const latitudinal = uniform( 0 ); // false, bool + const samples = uniform( 1 ); // int + const envMap = texture( null ); + + const cubeSampler=Fn(( [ sampleDirection ] )=>{ + return TSL_CubeTexture(envMap, sampleDirection, 0); + }); + blurMaterial.fragmentNode = blur( { n, latitudinal: latitudinal.equal( 1 ), poleAxis: vec3(poleAxis), outputDirection: positionWorldDirection, weights, samples, dTheta, sampler: cubeSampler } ); + const mesh = new Mesh( geometry, blurMaterial ); const scene = new Scene(); scene.add( mesh ); - const camera = new CubeCamera( 1, 10, blurTarget1 ); + const camera = new CubeCamera( 1, 10, blurTarget ); + + envMap.value=cubeMap.texture; + latitudinal.value=1; + const blurParams1=getBlurParams(sigmaRadians, cubeMap.width, MAX_SAMPLES); + weights.value=blurParams1.weights; + samples.value=blurParams1.samples; + dTheta.value=blurParams1.radiansPerPixel; camera.update( renderer, scene ); camera.renderTarget=this; + envMap.value=blurTarget.texture; + latitudinal.value=0; + const blurParams2=getBlurParams(sigmaRadians, blurTarget.width, MAX_SAMPLES); + weights.value=blurParams2.weights; + samples.value=blurParams2.samples; + dTheta.value=blurParams2.radiansPerPixel; camera.update( renderer, scene ); - blurTarget1.dispose(); + blurTarget.dispose(); } } From fe882eac9b17d0c5c4c9d16c064a4f1f1c9297ac Mon Sep 17 00:00:00 2001 From: Emmett Lalish Date: Thu, 19 Dec 2024 14:55:03 -0800 Subject: [PATCH 06/10] switched to userData --- src/nodes/pmrem/PMREMUtils.js | 11 +--- src/renderers/common/CubeRenderTarget.js | 2 +- src/renderers/common/extras/PMREMGenerator.js | 63 +++++++------------ 3 files changed, 27 insertions(+), 49 deletions(-) diff --git a/src/nodes/pmrem/PMREMUtils.js b/src/nodes/pmrem/PMREMUtils.js index 88196ca7e1661e..96c97e8471e373 100644 --- a/src/nodes/pmrem/PMREMUtils.js +++ b/src/nodes/pmrem/PMREMUtils.js @@ -303,19 +303,14 @@ export const getBlurParams=(sigmaRadians, cubeRes, maxSamples)=>{ } - const weights = []; + const weights = new Array( maxSamples ).fill( 0 ); let sum = 0; - for ( let i = 0; i < maxSamples; ++ i ) { - - if(i>=samples){ - weights.push(0); - continue; - } + for ( let i = 0; i < samples; ++ i ) { const x = i / sigmaPixels; const weight = Math.exp( - x * x / 2 ); - weights.push( weight ); + weights[i]= weight; if ( i === 0 ) { diff --git a/src/renderers/common/CubeRenderTarget.js b/src/renderers/common/CubeRenderTarget.js index 17a2c5dae92910..ab6a17e20ca380 100644 --- a/src/renderers/common/CubeRenderTarget.js +++ b/src/renderers/common/CubeRenderTarget.js @@ -2,7 +2,7 @@ import { equirectUV } from '../../nodes/utils/EquirectUVNode.js'; import { texture as TSL_Texture } from '../../nodes/accessors/TextureNode.js'; import { positionWorldDirection } from '../../nodes/accessors/Position.js'; import NodeMaterial from '../../materials/nodes/NodeMaterial.js'; -import { blur, getBlurParams } from '../../../nodes/pmrem/PMREMUtils.js'; +import { blur, getBlurParams } from '../../nodes/pmrem/PMREMUtils.js'; import { WebGLCubeRenderTarget } from '../../renderers/WebGLCubeRenderTarget.js'; import { Scene } from '../../scenes/Scene.js'; diff --git a/src/renderers/common/extras/PMREMGenerator.js b/src/renderers/common/extras/PMREMGenerator.js index 6bc307a0a1574a..7061ccfc4637a6 100644 --- a/src/renderers/common/extras/PMREMGenerator.js +++ b/src/renderers/common/extras/PMREMGenerator.js @@ -1,11 +1,10 @@ import NodeMaterial from '../../../materials/nodes/NodeMaterial.js'; import { getDirection, blur, bilinearCubeUV, getBlurParams } from '../../../nodes/pmrem/PMREMUtils.js'; import { equirectUV } from '../../../nodes/utils/EquirectUVNode.js'; -import { uniform } from '../../../nodes/core/UniformNode.js'; -import { uniformArray } from '../../../nodes/accessors/UniformArrayNode.js'; +import { userData } from '../../../nodes/accessors/UserDataNode.js'; import { texture } from '../../../nodes/accessors/TextureNode.js'; import { cubeTexture } from '../../../nodes/accessors/CubeTextureNode.js'; -import { float, vec3, Fn } from '../../../nodes/tsl/TSLBase.js'; +import { float, int, vec3, Fn } from '../../../nodes/tsl/TSLBase.js'; import { uv } from '../../../nodes/accessors/UV.js'; import { attribute } from '../../../nodes/core/AttributeNode.js'; @@ -622,26 +621,20 @@ class PMREMGenerator { const blurMesh = this._lodMeshes[ lodOut ]; blurMesh.material = blurMaterial; - const blurUniforms = blurMaterial.uniforms; - - const {radiansPerPixel, samples, weights}=getBlurParams(sigmaRadians, this._sizeLods[ lodIn ] - 1, MAX_SAMPLES); - targetIn.texture.frame = ( targetIn.texture.frame || 0 ) + 1; - - blurUniforms.envMap.value = targetIn.texture; - blurUniforms.samples.value = samples; - blurUniforms.weights.array = weights; - blurUniforms.latitudinal.value = direction === 'latitudinal' ? 1 : 0; - - if ( poleAxis ) { - - blurUniforms.poleAxis.value = poleAxis; - - } + blurMaterial._envMap.value = targetIn.texture const { _lodMax } = this; - blurUniforms.dTheta.value = radiansPerPixel; - blurUniforms.mipInt.value = _lodMax - lodIn; + const {radiansPerPixel, samples, weights}=getBlurParams(sigmaRadians, this._sizeLods[ lodIn ] - 1, MAX_SAMPLES); + + blurMesh.userData={ + samples, + weights, + poleAxis, + latitudinal: direction === 'latitudinal' ? 1 : 0, + dTheta: radiansPerPixel, + mipInt: _lodMax - lodIn + }; const outputSize = this._sizeLods[ lodOut ]; const x = 3 * outputSize * ( lodOut > _lodMax - LOD_MIN ? lodOut - _lodMax + LOD_MIN : 0 ); @@ -771,36 +764,26 @@ function _getMaterial( type ) { function _getBlurShader( lodMax, width, height ) { - const weights = uniformArray( new Array( MAX_SAMPLES ).fill( 0 ) ); - const poleAxis = uniform( new Vector3( 0, 1, 0 ) ); - const dTheta = uniform( 0 ); + const weights = userData( 'weights', 'float' ); + const poleAxis = userData( 'poleAxis', 'vec3' ); + const dTheta = userData( 'dTheta', 'float' ); const n = float( MAX_SAMPLES ); - const latitudinal = uniform( 0 ); // false, bool - const samples = uniform( 1 ); // int + const latitudinal = userData( 'latitudinal', 'int' ); // bool + const samples = userData( 'samples', 'int' ); + const mipInt = userData( 'mipInt', 'int' ); + const envMap = texture( null ); - const mipInt = uniform( 0 ); // int const CUBEUV_TEXEL_WIDTH = float( 1 / width ); const CUBEUV_TEXEL_HEIGHT = float( 1 / height ); const CUBEUV_MAX_MIP = float( lodMax ); - const materialUniforms = { - n, - latitudinal, - weights, - poleAxis, - outputDirection, - dTheta, - samples, - envMap, - mipInt - }; - const material = _getMaterial( 'blur' ); - material.uniforms = materialUniforms; // TODO: Move to outside of the material + material._envMap = envMap; + const cubeUVsampler=Fn(( [ sampleDirection ] )=>{ return bilinearCubeUV( envMap, sampleDirection, mipInt, CUBEUV_TEXEL_WIDTH, CUBEUV_TEXEL_HEIGHT, CUBEUV_MAX_MIP ); }); - material.fragmentNode = blur( { ...materialUniforms, latitudinal: latitudinal.equal( 1 ), sampler: cubeUVsampler } ); + material.fragmentNode = blur( { n, latitudinal: latitudinal.equal( int ( 1 ) ), poleAxis, outputDirection, weights, samples, dTheta, sampler: cubeUVsampler } ); return material; From 1981a27aa90997768da83580117334c870a81763 Mon Sep 17 00:00:00 2001 From: Emmett Lalish Date: Mon, 23 Dec 2024 12:00:48 -0800 Subject: [PATCH 07/10] rename to fromCubeTexture --- src/renderers/common/CubeRenderTarget.js | 57 ++++++++++++++++-------- 1 file changed, 38 insertions(+), 19 deletions(-) diff --git a/src/renderers/common/CubeRenderTarget.js b/src/renderers/common/CubeRenderTarget.js index ab6a17e20ca380..1556edc5bf36bb 100644 --- a/src/renderers/common/CubeRenderTarget.js +++ b/src/renderers/common/CubeRenderTarget.js @@ -74,15 +74,22 @@ class CubeRenderTarget extends WebGLCubeRenderTarget { } - fromBlur(renderer, cubeMap, sigmaRadians, poleAxis=new Vector3(0, 1, 0)){ + fromCubeTexture(renderer, cubeTexture, sigmaRadians=0, poleAxis=new Vector3(0, 1, 0)){ + const currentGenerateMipmaps = cubeTexture.generateMipmaps; + + cubeTexture.generateMipmaps = true; + + this.texture.type = cubeTexture.type; + this.texture.colorSpace = cubeTexture.colorSpace; + + this.texture.generateMipmaps = cubeTexture.generateMipmaps; + this.texture.minFilter = cubeTexture.minFilter; + this.texture.magFilter = cubeTexture.magFilter; + // The maximum length of the blur for loop. Smaller sigmas will use fewer // samples and exit early, but not recompile the shader. const MAX_SAMPLES = 20; - const blurTarget=new CubeRenderTarget(Math.min(this.width, cubeMap.width)); - - const geometry = new BoxGeometry( 5, 5, 5 ); - const blurMaterial = new NodeMaterial(); blurMaterial.side = BackSide; blurMaterial.depthTest = false; @@ -101,33 +108,45 @@ class CubeRenderTarget extends WebGLCubeRenderTarget { }); blurMaterial.fragmentNode = blur( { n, latitudinal: latitudinal.equal( 1 ), poleAxis: vec3(poleAxis), outputDirection: positionWorldDirection, weights, samples, dTheta, sampler: cubeSampler } ); + const geometry = new BoxGeometry( 5, 5, 5 ); const mesh = new Mesh( geometry, blurMaterial ); const scene = new Scene(); scene.add( mesh ); - const camera = new CubeCamera( 1, 10, blurTarget ); - - envMap.value=cubeMap.texture; + const camera = new CubeCamera( 1, 10, this ); + + envMap.value=cubeTexture; latitudinal.value=1; - const blurParams1=getBlurParams(sigmaRadians, cubeMap.width, MAX_SAMPLES); + const blurParams1=getBlurParams(sigmaRadians, cubeTexture.width, MAX_SAMPLES); weights.value=blurParams1.weights; samples.value=blurParams1.samples; dTheta.value=blurParams1.radiansPerPixel; - camera.update( renderer, scene ); + if(sigmaRadians<=0){ + camera.update( renderer, scene ); + }else{ + const blurTarget=new CubeRenderTarget(Math.min(this.width, cubeTexture.width)); + camera.renderTarget=blurTarget; - camera.renderTarget=this; - envMap.value=blurTarget.texture; - latitudinal.value=0; - const blurParams2=getBlurParams(sigmaRadians, blurTarget.width, MAX_SAMPLES); - weights.value=blurParams2.weights; - samples.value=blurParams2.samples; - dTheta.value=blurParams2.radiansPerPixel; + camera.update( renderer, scene ); - camera.update( renderer, scene ); + camera.renderTarget=this; + envMap.value=blurTarget.texture; + latitudinal.value=0; + const blurParams2=getBlurParams(sigmaRadians, blurTarget.width, MAX_SAMPLES); + weights.value=blurParams2.weights; + samples.value=blurParams2.samples; + dTheta.value=blurParams2.radiansPerPixel; + + camera.update( renderer, scene ); + + blurTarget.dispose(); + } - blurTarget.dispose(); + cubeTexture.currentGenerateMipmaps = currentGenerateMipmaps; + geometry.dispose(); + blurMaterial.dispose(); } } From 5afa0c9243635d65b44ca4329a489b5d5608e052 Mon Sep 17 00:00:00 2001 From: Emmett Lalish Date: Mon, 23 Dec 2024 14:43:56 -0800 Subject: [PATCH 08/10] export CubeRenderTarget --- src/Three.WebGPU.js | 1 + src/renderers/common/CubeRenderTarget.js | 8 ++++++-- 2 files changed, 7 insertions(+), 2 deletions(-) diff --git a/src/Three.WebGPU.js b/src/Three.WebGPU.js index 4289377b368d9a..7c641a4642955e 100644 --- a/src/Three.WebGPU.js +++ b/src/Three.WebGPU.js @@ -6,6 +6,7 @@ export { default as Lighting } from './renderers/common/Lighting.js'; export { default as BundleGroup } from './renderers/common/BundleGroup.js'; export { default as QuadMesh } from './renderers/common/QuadMesh.js'; export { default as PMREMGenerator } from './renderers/common/extras/PMREMGenerator.js'; +export { default as CubeRenderTarget } from './renderers/common/CubeRenderTarget.js'; export { default as PostProcessing } from './renderers/common/PostProcessing.js'; import * as PostProcessingUtils from './renderers/common/PostProcessingUtils.js'; export { PostProcessingUtils }; diff --git a/src/renderers/common/CubeRenderTarget.js b/src/renderers/common/CubeRenderTarget.js index 1556edc5bf36bb..141217f9a82f82 100644 --- a/src/renderers/common/CubeRenderTarget.js +++ b/src/renderers/common/CubeRenderTarget.js @@ -3,6 +3,9 @@ import { texture as TSL_Texture } from '../../nodes/accessors/TextureNode.js'; import { positionWorldDirection } from '../../nodes/accessors/Position.js'; import NodeMaterial from '../../materials/nodes/NodeMaterial.js'; import { blur, getBlurParams } from '../../nodes/pmrem/PMREMUtils.js'; +import { uniform } from '../../nodes/core/UniformNode.js'; +import { uniformArray } from '../../nodes/accessors/UniformArrayNode.js'; +import { float, vec3, Fn } from '../../nodes/tsl/TSLBase.js'; import { WebGLCubeRenderTarget } from '../../renderers/WebGLCubeRenderTarget.js'; import { Scene } from '../../scenes/Scene.js'; @@ -11,6 +14,7 @@ import { BoxGeometry } from '../../geometries/BoxGeometry.js'; import { Mesh } from '../../objects/Mesh.js'; import { BackSide, NoBlending, LinearFilter, LinearMipmapLinearFilter } from '../../constants.js'; import {cubeTexture as TSL_CubeTexture} from '../../nodes/accessors/CubeTextureNode.js'; +import { Vector3 } from '../../math/Vector3.js'; // @TODO: Consider rename WebGLCubeRenderTarget to just CubeRenderTarget @@ -101,10 +105,10 @@ class CubeRenderTarget extends WebGLCubeRenderTarget { const n = float( MAX_SAMPLES ); const latitudinal = uniform( 0 ); // false, bool const samples = uniform( 1 ); // int - const envMap = texture( null ); + const envMap = TSL_CubeTexture( null ); const cubeSampler=Fn(( [ sampleDirection ] )=>{ - return TSL_CubeTexture(envMap, sampleDirection, 0); + return envMap.sample( sampleDirection ); }); blurMaterial.fragmentNode = blur( { n, latitudinal: latitudinal.equal( 1 ), poleAxis: vec3(poleAxis), outputDirection: positionWorldDirection, weights, samples, dTheta, sampler: cubeSampler } ); From 43468388ca9282b866ad6bee5630d24150041b5e Mon Sep 17 00:00:00 2001 From: Emmett Lalish Date: Mon, 23 Dec 2024 14:49:23 -0800 Subject: [PATCH 09/10] mrdoob approves --- src/nodes/pmrem/PMREMUtils.js | 11 ++-- src/renderers/common/CubeRenderTarget.js | 58 +++++++++++-------- src/renderers/common/extras/PMREMGenerator.js | 18 +++--- 3 files changed, 49 insertions(+), 38 deletions(-) diff --git a/src/nodes/pmrem/PMREMUtils.js b/src/nodes/pmrem/PMREMUtils.js index 96c97e8471e373..4b0df995f33cea 100644 --- a/src/nodes/pmrem/PMREMUtils.js +++ b/src/nodes/pmrem/PMREMUtils.js @@ -287,13 +287,14 @@ export const blur = /*@__PURE__*/ Fn( ( { n, latitudinal, poleAxis, outputDirect } ); -export const getBlurParams=(sigmaRadians, cubeRes, maxSamples)=>{ +export const getBlurParams = ( sigmaRadians, cubeRes, maxSamples )=>{ + // Number of standard deviations at which to cut off the discrete approximation. const STANDARD_DEVIATIONS = 3; const radiansPerPixel = Math.PI / ( 2 * cubeRes ); const sigmaPixels = sigmaRadians / radiansPerPixel; - const samples =1 + Math.floor( STANDARD_DEVIATIONS * sigmaPixels ); + const samples = 1 + Math.floor( STANDARD_DEVIATIONS * sigmaPixels ); if ( samples > maxSamples ) { @@ -310,7 +311,7 @@ export const getBlurParams=(sigmaRadians, cubeRes, maxSamples)=>{ const x = i / sigmaPixels; const weight = Math.exp( - x * x / 2 ); - weights[i]= weight; + weights[ i ] = weight; if ( i === 0 ) { @@ -330,6 +331,6 @@ export const getBlurParams=(sigmaRadians, cubeRes, maxSamples)=>{ } - return {radiansPerPixel, samples, weights}; - + return { radiansPerPixel, samples, weights }; + }; diff --git a/src/renderers/common/CubeRenderTarget.js b/src/renderers/common/CubeRenderTarget.js index 141217f9a82f82..bff015198c3cbb 100644 --- a/src/renderers/common/CubeRenderTarget.js +++ b/src/renderers/common/CubeRenderTarget.js @@ -13,7 +13,7 @@ import { CubeCamera } from '../../cameras/CubeCamera.js'; import { BoxGeometry } from '../../geometries/BoxGeometry.js'; import { Mesh } from '../../objects/Mesh.js'; import { BackSide, NoBlending, LinearFilter, LinearMipmapLinearFilter } from '../../constants.js'; -import {cubeTexture as TSL_CubeTexture} from '../../nodes/accessors/CubeTextureNode.js'; +import { cubeTexture as TSL_CubeTexture } from '../../nodes/accessors/CubeTextureNode.js'; import { Vector3 } from '../../math/Vector3.js'; // @TODO: Consider rename WebGLCubeRenderTarget to just CubeRenderTarget @@ -78,7 +78,8 @@ class CubeRenderTarget extends WebGLCubeRenderTarget { } - fromCubeTexture(renderer, cubeTexture, sigmaRadians=0, poleAxis=new Vector3(0, 1, 0)){ + fromCubeTexture( renderer, cubeTexture, sigmaRadians = 0, poleAxis = new Vector3( 0, 1, 0 ) ) { + const currentGenerateMipmaps = cubeTexture.generateMipmaps; cubeTexture.generateMipmaps = true; @@ -107,10 +108,12 @@ class CubeRenderTarget extends WebGLCubeRenderTarget { const samples = uniform( 1 ); // int const envMap = TSL_CubeTexture( null ); - const cubeSampler=Fn(( [ sampleDirection ] )=>{ - return envMap.sample( sampleDirection ); - }); - blurMaterial.fragmentNode = blur( { n, latitudinal: latitudinal.equal( 1 ), poleAxis: vec3(poleAxis), outputDirection: positionWorldDirection, weights, samples, dTheta, sampler: cubeSampler } ); + const cubeSampler = Fn( ( [ sampleDirection ] )=>{ + + return envMap.sample( sampleDirection ); + + } ); + blurMaterial.fragmentNode = blur( { n, latitudinal: latitudinal.equal( 1 ), poleAxis: vec3( poleAxis ), outputDirection: positionWorldDirection, weights, samples, dTheta, sampler: cubeSampler } ); const geometry = new BoxGeometry( 5, 5, 5 ); const mesh = new Mesh( geometry, blurMaterial ); @@ -119,38 +122,43 @@ class CubeRenderTarget extends WebGLCubeRenderTarget { scene.add( mesh ); const camera = new CubeCamera( 1, 10, this ); - - envMap.value=cubeTexture; - latitudinal.value=1; - const blurParams1=getBlurParams(sigmaRadians, cubeTexture.width, MAX_SAMPLES); - weights.value=blurParams1.weights; - samples.value=blurParams1.samples; - dTheta.value=blurParams1.radiansPerPixel; - - if(sigmaRadians<=0){ + + envMap.value = cubeTexture; + latitudinal.value = 1; + const blurParams1 = getBlurParams( sigmaRadians, cubeTexture.width, MAX_SAMPLES ); + weights.value = blurParams1.weights; + samples.value = blurParams1.samples; + dTheta.value = blurParams1.radiansPerPixel; + + if ( sigmaRadians <= 0 ) { + camera.update( renderer, scene ); - }else{ - const blurTarget=new CubeRenderTarget(Math.min(this.width, cubeTexture.width)); - camera.renderTarget=blurTarget; + + } else { + + const blurTarget = new CubeRenderTarget( Math.min( this.width, cubeTexture.width ) ); + camera.renderTarget = blurTarget; camera.update( renderer, scene ); - camera.renderTarget=this; - envMap.value=blurTarget.texture; - latitudinal.value=0; - const blurParams2=getBlurParams(sigmaRadians, blurTarget.width, MAX_SAMPLES); - weights.value=blurParams2.weights; - samples.value=blurParams2.samples; - dTheta.value=blurParams2.radiansPerPixel; + camera.renderTarget = this; + envMap.value = blurTarget.texture; + latitudinal.value = 0; + const blurParams2 = getBlurParams( sigmaRadians, blurTarget.width, MAX_SAMPLES ); + weights.value = blurParams2.weights; + samples.value = blurParams2.samples; + dTheta.value = blurParams2.radiansPerPixel; camera.update( renderer, scene ); blurTarget.dispose(); + } cubeTexture.currentGenerateMipmaps = currentGenerateMipmaps; geometry.dispose(); blurMaterial.dispose(); + } } diff --git a/src/renderers/common/extras/PMREMGenerator.js b/src/renderers/common/extras/PMREMGenerator.js index 7061ccfc4637a6..fc305dd618ad3e 100644 --- a/src/renderers/common/extras/PMREMGenerator.js +++ b/src/renderers/common/extras/PMREMGenerator.js @@ -622,12 +622,12 @@ class PMREMGenerator { blurMesh.material = blurMaterial; targetIn.texture.frame = ( targetIn.texture.frame || 0 ) + 1; - blurMaterial._envMap.value = targetIn.texture + blurMaterial._envMap.value = targetIn.texture; const { _lodMax } = this; - const {radiansPerPixel, samples, weights}=getBlurParams(sigmaRadians, this._sizeLods[ lodIn ] - 1, MAX_SAMPLES); - - blurMesh.userData={ + const { radiansPerPixel, samples, weights } = getBlurParams( sigmaRadians, this._sizeLods[ lodIn ] - 1, MAX_SAMPLES ); + + blurMesh.userData = { samples, weights, poleAxis, @@ -779,11 +779,13 @@ function _getBlurShader( lodMax, width, height ) { const material = _getMaterial( 'blur' ); material._envMap = envMap; - - const cubeUVsampler=Fn(( [ sampleDirection ] )=>{ + + const cubeUVsampler = Fn( ( [ sampleDirection ] )=>{ + return bilinearCubeUV( envMap, sampleDirection, mipInt, CUBEUV_TEXEL_WIDTH, CUBEUV_TEXEL_HEIGHT, CUBEUV_MAX_MIP ); - }); - material.fragmentNode = blur( { n, latitudinal: latitudinal.equal( int ( 1 ) ), poleAxis, outputDirection, weights, samples, dTheta, sampler: cubeUVsampler } ); + + } ); + material.fragmentNode = blur( { n, latitudinal: latitudinal.equal( int( 1 ) ), poleAxis, outputDirection, weights, samples, dTheta, sampler: cubeUVsampler } ); return material; From a5d3e89dfd1d6b50426462c275b5049bc79b4e1f Mon Sep 17 00:00:00 2001 From: Emmett Lalish Date: Fri, 27 Dec 2024 14:21:06 -0800 Subject: [PATCH 10/10] test in example --- examples/webgpu_cubemap_adjustments.html | 9 ++++++-- src/renderers/common/CubeRenderTarget.js | 26 +++++++++++++----------- 2 files changed, 21 insertions(+), 14 deletions(-) diff --git a/examples/webgpu_cubemap_adjustments.html b/examples/webgpu_cubemap_adjustments.html index 7b7d0b579a12c7..414aee699a3738 100644 --- a/examples/webgpu_cubemap_adjustments.html +++ b/examples/webgpu_cubemap_adjustments.html @@ -72,6 +72,12 @@ cube2Texture.generateMipmaps = true; cube2Texture.minFilter = THREE.LinearMipmapLinearFilter; + renderer = new THREE.WebGPURenderer( { antialias: true } ); + await renderer.init(); + + const cube2Blur = new THREE.CubeRenderTarget(cube2Texture.source.data[0].width); + cube2Blur.fromCubeTexture(renderer, cube2Texture, 0.1); + // nodes and environment const adjustments = { @@ -95,7 +101,7 @@ const custom1UV = reflectNode.xyz.mul( uniform( rotateY1Matrix ) ); const custom2UV = reflectNode.xyz.mul( uniform( rotateY2Matrix ) ); - const mixCubeMaps = mix( pmremTexture( cube1Texture, custom1UV ), pmremTexture( cube2Texture, custom2UV ), positionNode.y.add( mixNode ).clamp() ); + const mixCubeMaps = mix( pmremTexture( cube1Texture, custom1UV ), pmremTexture( cube2Blur.texture, custom2UV ), positionNode.y.add( mixNode ).clamp() ); const proceduralEnv = mix( mixCubeMaps, normalWorld, proceduralNode ); @@ -133,7 +139,6 @@ // renderer and controls - renderer = new THREE.WebGPURenderer( { antialias: true } ); renderer.setPixelRatio( window.devicePixelRatio ); renderer.setSize( window.innerWidth, window.innerHeight ); renderer.toneMapping = THREE.LinearToneMapping; diff --git a/src/renderers/common/CubeRenderTarget.js b/src/renderers/common/CubeRenderTarget.js index bff015198c3cbb..8beea5136d8a2a 100644 --- a/src/renderers/common/CubeRenderTarget.js +++ b/src/renderers/common/CubeRenderTarget.js @@ -78,18 +78,18 @@ class CubeRenderTarget extends WebGLCubeRenderTarget { } - fromCubeTexture( renderer, cubeTexture, sigmaRadians = 0, poleAxis = new Vector3( 0, 1, 0 ) ) { + fromCubeTexture( renderer, cubeTex, sigmaRadians = 0, poleAxis = new Vector3( 0, 1, 0 ) ) { - const currentGenerateMipmaps = cubeTexture.generateMipmaps; + const currentGenerateMipmaps = cubeTex.generateMipmaps; - cubeTexture.generateMipmaps = true; + cubeTex.generateMipmaps = true; - this.texture.type = cubeTexture.type; - this.texture.colorSpace = cubeTexture.colorSpace; + this.texture.type = cubeTex.type; + this.texture.colorSpace = cubeTex.colorSpace; - this.texture.generateMipmaps = cubeTexture.generateMipmaps; - this.texture.minFilter = cubeTexture.minFilter; - this.texture.magFilter = cubeTexture.magFilter; + this.texture.generateMipmaps = cubeTex.generateMipmaps; + this.texture.minFilter = cubeTex.minFilter; + this.texture.magFilter = cubeTex.magFilter; // The maximum length of the blur for loop. Smaller sigmas will use fewer // samples and exit early, but not recompile the shader. @@ -123,9 +123,11 @@ class CubeRenderTarget extends WebGLCubeRenderTarget { const camera = new CubeCamera( 1, 10, this ); - envMap.value = cubeTexture; + const width = cubeTex.source.data[0].width; + + envMap.value = cubeTex; latitudinal.value = 1; - const blurParams1 = getBlurParams( sigmaRadians, cubeTexture.width, MAX_SAMPLES ); + const blurParams1 = getBlurParams( sigmaRadians, width, MAX_SAMPLES ); weights.value = blurParams1.weights; samples.value = blurParams1.samples; dTheta.value = blurParams1.radiansPerPixel; @@ -136,7 +138,7 @@ class CubeRenderTarget extends WebGLCubeRenderTarget { } else { - const blurTarget = new CubeRenderTarget( Math.min( this.width, cubeTexture.width ) ); + const blurTarget = new CubeRenderTarget( Math.min( this.width, width ) ); camera.renderTarget = blurTarget; camera.update( renderer, scene ); @@ -155,7 +157,7 @@ class CubeRenderTarget extends WebGLCubeRenderTarget { } - cubeTexture.currentGenerateMipmaps = currentGenerateMipmaps; + cubeTex.currentGenerateMipmaps = currentGenerateMipmaps; geometry.dispose(); blurMaterial.dispose();