From f0b6a7c0eec98ef5a3d6be50b8a23b4a58550f20 Mon Sep 17 00:00:00 2001 From: Rik Cabanier Date: Thu, 9 Nov 2023 00:58:15 +0000 Subject: [PATCH 01/15] add support for depth sensing --- examples/webxr_xr_ballshooter.html | 2 +- examples/webxr_xr_cubes.html | 2 +- examples/webxr_xr_dragging.html | 2 +- src/materials/LineBasicMaterial.js | 4 + src/materials/MeshBasicMaterial.js | 4 + src/materials/MeshLambertMaterial.js | 4 + src/materials/MeshMatcapMaterial.js | 4 + src/materials/MeshPhongMaterial.js | 4 + src/materials/MeshStandardMaterial.js | 4 + src/materials/MeshToonMaterial.js | 4 + src/materials/PointsMaterial.js | 4 + src/materials/ShaderMaterial.js | 2 + src/renderers/WebGLRenderer.js | 27 +++++- src/renderers/shaders/ShaderChunk.js | 4 + .../ShaderChunk/occlusion_fragment.glsl.js | 20 ++++ .../occlusion_pars_fragment.glsl.js | 97 +++++++++++++++++++ src/renderers/shaders/ShaderLib.js | 12 ++- .../shaders/ShaderLib/linedashed.glsl.js | 2 + .../shaders/ShaderLib/meshbasic.glsl.js | 2 + .../shaders/ShaderLib/meshlambert.glsl.js | 2 + .../shaders/ShaderLib/meshmatcap.glsl.js | 2 + .../shaders/ShaderLib/meshnormal.glsl.js | 3 + .../shaders/ShaderLib/meshphong.glsl.js | 2 + .../shaders/ShaderLib/meshphysical.glsl.js | 2 + .../shaders/ShaderLib/meshtoon.glsl.js | 2 + .../shaders/ShaderLib/points.glsl.js | 2 + src/renderers/shaders/UniformsLib.js | 6 ++ src/renderers/webgl/WebGLMaterials.js | 11 ++- src/renderers/webgl/WebGLProgram.js | 4 + src/renderers/webgl/WebGLPrograms.js | 9 +- src/renderers/webxr/WebXRManager.js | 62 ++++++++++++ 31 files changed, 303 insertions(+), 8 deletions(-) create mode 100644 src/renderers/shaders/ShaderChunk/occlusion_fragment.glsl.js create mode 100644 src/renderers/shaders/ShaderChunk/occlusion_pars_fragment.glsl.js diff --git a/examples/webxr_xr_ballshooter.html b/examples/webxr_xr_ballshooter.html index e004525b3dce12..28e39f2df18181 100644 --- a/examples/webxr_xr_ballshooter.html +++ b/examples/webxr_xr_ballshooter.html @@ -81,7 +81,7 @@ controls.target.y = 1.6; controls.update(); - document.body.appendChild( XRButton.createButton( renderer ) ); + document.body.appendChild( XRButton.createButton( renderer, { 'optionalFeatures': [ 'depth-sensing'] } ) ); // controllers diff --git a/examples/webxr_xr_cubes.html b/examples/webxr_xr_cubes.html index 3e35132a330e40..d51514f950d99f 100644 --- a/examples/webxr_xr_cubes.html +++ b/examples/webxr_xr_cubes.html @@ -141,7 +141,7 @@ // - document.body.appendChild( XRButton.createButton( renderer ) ); + document.body.appendChild( XRButton.createButton( renderer, { 'optionalFeatures': [ 'depth-sensing'] } ) ); } diff --git a/examples/webxr_xr_dragging.html b/examples/webxr_xr_dragging.html index 5154bffbc87980..d27cea1b25ccf7 100644 --- a/examples/webxr_xr_dragging.html +++ b/examples/webxr_xr_dragging.html @@ -125,7 +125,7 @@ renderer.xr.enabled = true; container.appendChild( renderer.domElement ); - document.body.appendChild( XRButton.createButton( renderer ) ); + document.body.appendChild( XRButton.createButton( renderer, { 'optionalFeatures': [ 'depth-sensing'] } ) ); // controllers diff --git a/src/materials/LineBasicMaterial.js b/src/materials/LineBasicMaterial.js index b6cc7be93afff5..efd1e3201ee499 100644 --- a/src/materials/LineBasicMaterial.js +++ b/src/materials/LineBasicMaterial.js @@ -21,6 +21,8 @@ class LineBasicMaterial extends Material { this.fog = true; + this.occlusion = true; + this.setValues( parameters ); } @@ -40,6 +42,8 @@ class LineBasicMaterial extends Material { this.fog = source.fog; + this.occlusion = source.occlusion; + return this; } diff --git a/src/materials/MeshBasicMaterial.js b/src/materials/MeshBasicMaterial.js index b9f7c2b5706fdf..4fe13367e7e48c 100644 --- a/src/materials/MeshBasicMaterial.js +++ b/src/materials/MeshBasicMaterial.js @@ -38,6 +38,8 @@ class MeshBasicMaterial extends Material { this.fog = true; + this.occlusion = true; + this.setValues( parameters ); } @@ -72,6 +74,8 @@ class MeshBasicMaterial extends Material { this.fog = source.fog; + this.occlusion = source.occlusion; + return this; } diff --git a/src/materials/MeshLambertMaterial.js b/src/materials/MeshLambertMaterial.js index a7c3b05053b85c..3e1a8a4098a248 100644 --- a/src/materials/MeshLambertMaterial.js +++ b/src/materials/MeshLambertMaterial.js @@ -56,6 +56,8 @@ class MeshLambertMaterial extends Material { this.fog = true; + this.occlusion = true; + this.setValues( parameters ); } @@ -107,6 +109,8 @@ class MeshLambertMaterial extends Material { this.fog = source.fog; + this.occlusion = source.occlusion; + return this; } diff --git a/src/materials/MeshMatcapMaterial.js b/src/materials/MeshMatcapMaterial.js index 84030dcae04ab2..95004ab57a72e1 100644 --- a/src/materials/MeshMatcapMaterial.js +++ b/src/materials/MeshMatcapMaterial.js @@ -38,6 +38,8 @@ class MeshMatcapMaterial extends Material { this.fog = true; + this.occlusion = true; + this.setValues( parameters ); } @@ -72,6 +74,8 @@ class MeshMatcapMaterial extends Material { this.fog = source.fog; + this.occlusion = source.occlusion; + return this; } diff --git a/src/materials/MeshPhongMaterial.js b/src/materials/MeshPhongMaterial.js index 6dfe9e46c27c0d..3fe95f00546cf1 100644 --- a/src/materials/MeshPhongMaterial.js +++ b/src/materials/MeshPhongMaterial.js @@ -58,6 +58,8 @@ class MeshPhongMaterial extends Material { this.fog = true; + this.occlusion = true; + this.setValues( parameters ); } @@ -111,6 +113,8 @@ class MeshPhongMaterial extends Material { this.fog = source.fog; + this.occlusion = source.occlusion; + return this; } diff --git a/src/materials/MeshStandardMaterial.js b/src/materials/MeshStandardMaterial.js index 1821cf2ffa446a..9195b95907469d 100644 --- a/src/materials/MeshStandardMaterial.js +++ b/src/materials/MeshStandardMaterial.js @@ -60,6 +60,8 @@ class MeshStandardMaterial extends Material { this.fog = true; + this.occlusion = true; + this.setValues( parameters ); } @@ -115,6 +117,8 @@ class MeshStandardMaterial extends Material { this.fog = source.fog; + this.occlusion = source.occlusion; + return this; } diff --git a/src/materials/MeshToonMaterial.js b/src/materials/MeshToonMaterial.js index 2f9b2f9e273b5e..d894c49b15c628 100644 --- a/src/materials/MeshToonMaterial.js +++ b/src/materials/MeshToonMaterial.js @@ -50,6 +50,8 @@ class MeshToonMaterial extends Material { this.fog = true; + this.occlusion = true; + this.setValues( parameters ); } @@ -93,6 +95,8 @@ class MeshToonMaterial extends Material { this.fog = source.fog; + this.occlusion = source.occlusion; + return this; } diff --git a/src/materials/PointsMaterial.js b/src/materials/PointsMaterial.js index 8ca5500d6ee124..c689a7339b16c3 100644 --- a/src/materials/PointsMaterial.js +++ b/src/materials/PointsMaterial.js @@ -22,6 +22,8 @@ class PointsMaterial extends Material { this.fog = true; + this.occlusion = true; + this.setValues( parameters ); } @@ -41,6 +43,8 @@ class PointsMaterial extends Material { this.fog = source.fog; + this.occlusion = source.occlusion; + return this; } diff --git a/src/materials/ShaderMaterial.js b/src/materials/ShaderMaterial.js index 11cafe04f44db7..7013da21e4ea26 100644 --- a/src/materials/ShaderMaterial.js +++ b/src/materials/ShaderMaterial.js @@ -79,6 +79,8 @@ class ShaderMaterial extends Material { this.lights = source.lights; this.clipping = source.clipping; + this.occlusion = source.occlusion; + this.extensions = Object.assign( {}, source.extensions ); this.glslVersion = source.glslVersion; diff --git a/src/renderers/WebGLRenderer.js b/src/renderers/WebGLRenderer.js index 96cd78cf81d2ed..fe169c19551303 100644 --- a/src/renderers/WebGLRenderer.js +++ b/src/renderers/WebGLRenderer.js @@ -210,6 +210,7 @@ class WebGLRenderer { const _vector3 = new Vector3(); const _emptyScene = { background: null, fog: null, environment: null, overrideMaterial: null, isScene: true }; + let _occlusion = null; function getTargetPixelRatio() { @@ -415,6 +416,20 @@ class WebGLRenderer { }; + this.setOcclusion = function ( value ) { + + if ( value === undefined ) return; + + _occlusion = value; + + }; + + this.clearOcclusion = function () { + + _occlusion = null; + + }; + this.getSize = function ( target ) { return target.set( _width, _height ); @@ -1600,7 +1615,7 @@ class WebGLRenderer { const lightsStateVersion = lights.state.version; - const parameters = programCache.getParameters( material, lights.state, shadowsArray, scene, object ); + const parameters = programCache.getParameters( material, lights.state, shadowsArray, scene, object, _occlusion ); const programCacheKey = programCache.getProgramCacheKey( parameters ); let programs = materialProperties.programs; @@ -1840,6 +1855,10 @@ class WebGLRenderer { needsProgramChange = true; + } else if ( material.occlusion === true ) { + + needsProgramChange = true; + } else if ( materialProperties.numClippingPlanes !== undefined && ( materialProperties.numClippingPlanes !== clipping.numPlanes || materialProperties.numIntersection !== clipping.numIntersection ) ) { @@ -2054,6 +2073,12 @@ class WebGLRenderer { } + if ( _occlusion && material.occlusion === true ) { + + materials.refreshOcclusionUniforms( m_uniforms, _occlusion ); + + } + materials.refreshMaterialUniforms( m_uniforms, material, _pixelRatio, _height, _transmissionRenderTarget ); WebGLUniforms.upload( _gl, getUniformList( materialProperties ), m_uniforms, textures ); diff --git a/src/renderers/shaders/ShaderChunk.js b/src/renderers/shaders/ShaderChunk.js index 78d1fa0844268e..88b620f1d47ccb 100644 --- a/src/renderers/shaders/ShaderChunk.js +++ b/src/renderers/shaders/ShaderChunk.js @@ -74,6 +74,8 @@ import normal_pars_fragment from './ShaderChunk/normal_pars_fragment.glsl.js'; import normal_pars_vertex from './ShaderChunk/normal_pars_vertex.glsl.js'; import normal_vertex from './ShaderChunk/normal_vertex.glsl.js'; import normalmap_pars_fragment from './ShaderChunk/normalmap_pars_fragment.glsl.js'; +import occlusion_fragment from './ShaderChunk/occlusion_fragment.glsl.js'; +import occlusion_pars_fragment from './ShaderChunk/occlusion_pars_fragment.glsl.js'; import clearcoat_normal_fragment_begin from './ShaderChunk/clearcoat_normal_fragment_begin.glsl.js'; import clearcoat_normal_fragment_maps from './ShaderChunk/clearcoat_normal_fragment_maps.glsl.js'; import clearcoat_pars_fragment from './ShaderChunk/clearcoat_pars_fragment.glsl.js'; @@ -200,6 +202,8 @@ export const ShaderChunk = { normal_pars_vertex: normal_pars_vertex, normal_vertex: normal_vertex, normalmap_pars_fragment: normalmap_pars_fragment, + occlusion_fragment: occlusion_fragment, + occlusion_pars_fragment: occlusion_pars_fragment, clearcoat_normal_fragment_begin: clearcoat_normal_fragment_begin, clearcoat_normal_fragment_maps: clearcoat_normal_fragment_maps, clearcoat_pars_fragment: clearcoat_pars_fragment, diff --git a/src/renderers/shaders/ShaderChunk/occlusion_fragment.glsl.js b/src/renderers/shaders/ShaderChunk/occlusion_fragment.glsl.js new file mode 100644 index 00000000000000..62b7b59603efb4 --- /dev/null +++ b/src/renderers/shaders/ShaderChunk/occlusion_fragment.glsl.js @@ -0,0 +1,20 @@ +export default /* glsl */` +#ifdef USE_OCCLUSION + if (gl_FragColor.a > 0.0) { + int arrayIndex = 0; + vec2 depthUv; + if (gl_FragCoord.x>=depthWidth) { + arrayIndex = 1; + depthUv = vec2((gl_FragCoord.x-depthWidth)/depthWidth, gl_FragCoord.y/depthHeight); + } else { + depthUv = vec2(gl_FragCoord.x/depthWidth, gl_FragCoord.y/depthHeight); + } + float assetDepthM = gl_FragCoord.z; + + //float occlusion = Depth_GetOcclusion(depthColor, depthUv, assetDepthM, arrayIndex); + float occlusion = Depth_GetBlurredOcclusionAroundUV(depthColor, depthUv, assetDepthM, arrayIndex); + + gl_FragColor *= 1.0 - occlusion; + } +#endif +`; diff --git a/src/renderers/shaders/ShaderChunk/occlusion_pars_fragment.glsl.js b/src/renderers/shaders/ShaderChunk/occlusion_pars_fragment.glsl.js new file mode 100644 index 00000000000000..b1441c71a10302 --- /dev/null +++ b/src/renderers/shaders/ShaderChunk/occlusion_pars_fragment.glsl.js @@ -0,0 +1,97 @@ +export default /* glsl */` +#ifdef USE_OCCLUSION + uniform sampler2DArray depthColor; + uniform float depthWidth; + uniform float depthHeight; + + float Depth_GetCameraDepthInMeters(const sampler2DArray depthTexture, + const vec2 depthUv, int arrayIndex) { + return texture(depthColor, vec3(depthUv.x, depthUv.y, arrayIndex)).r; + } + + float Depth_GetOcclusion(const sampler2DArray depthTexture, const vec2 depthUv, float assetDepthM, int arrayIndex) { + float depthMm = Depth_GetCameraDepthInMeters(depthTexture, depthUv, arrayIndex); + + // Instead of a hard z-buffer test, allow the asset to fade into the + // background along a 2 * kDepthTolerancePerM * assetDepthM + // range centered on the background depth. + const float kDepthTolerancePerM = 0.001; + return clamp(1.0 - + 0.5 * (depthMm - assetDepthM) / + (kDepthTolerancePerM * assetDepthM) + + 0.5, 0.0, 1.0); + } + + float Depth_GetBlurredOcclusionAroundUV(const sampler2DArray depthTexture, const vec2 uv, float assetDepthM, int arrayIndex) { + // Kernel used: + // 0 4 7 4 0 + // 4 16 26 16 4 + // 7 26 41 26 7 + // 4 16 26 16 4 + // 0 4 7 4 0 + const float kKernelTotalWeights = 269.0; + float sum = 0.0; + + const float kOcclusionBlurAmount = 0.0005; + vec2 blurriness = + vec2(kOcclusionBlurAmount, kOcclusionBlurAmount /** u_DepthAspectRatio*/); + + float current = 0.0; + + current += Depth_GetOcclusion( + depthTexture, uv + vec2(-1.0, -2.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(+1.0, -2.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(-1.0, +2.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(+1.0, +2.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(-2.0, +1.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(+2.0, +1.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(-2.0, -1.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(+2.0, -1.0) * blurriness, assetDepthM, arrayIndex); + sum += current * 4.0; + + current = 0.0; + current += Depth_GetOcclusion( + depthTexture, uv + vec2(-2.0, -0.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(+2.0, +0.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(+0.0, +2.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(-0.0, -2.0) * blurriness, assetDepthM, arrayIndex); + sum += current * 7.0; + + current = 0.0; + current += Depth_GetOcclusion( + depthTexture, uv + vec2(-1.0, -1.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(+1.0, -1.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(-1.0, +1.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(+1.0, +1.0) * blurriness, assetDepthM, arrayIndex); + sum += current * 16.0; + + current = 0.0; + current += Depth_GetOcclusion( + depthTexture, uv + vec2(+0.0, +1.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(-0.0, -1.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(-1.0, -0.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(+1.0, +0.0) * blurriness, assetDepthM, arrayIndex); + sum += current * 26.0; + + sum += Depth_GetOcclusion(depthTexture, uv, assetDepthM, arrayIndex) * 41.0; + + return sum / kKernelTotalWeights; + } +#endif +`; diff --git a/src/renderers/shaders/ShaderLib.js b/src/renderers/shaders/ShaderLib.js index 0ed7018ee9577c..1e80a37a41c655 100644 --- a/src/renderers/shaders/ShaderLib.js +++ b/src/renderers/shaders/ShaderLib.js @@ -16,7 +16,8 @@ const ShaderLib = { UniformsLib.envmap, UniformsLib.aomap, UniformsLib.lightmap, - UniformsLib.fog + UniformsLib.fog, + UniformsLib.occlusion ] ), vertexShader: ShaderChunk.meshbasic_vert, @@ -38,6 +39,7 @@ const ShaderLib = { UniformsLib.displacementmap, UniformsLib.fog, UniformsLib.lights, + UniformsLib.occlusion, { emissive: { value: /*@__PURE__*/ new Color( 0x000000 ) } } @@ -62,6 +64,7 @@ const ShaderLib = { UniformsLib.displacementmap, UniformsLib.fog, UniformsLib.lights, + UniformsLib.occlusion, { emissive: { value: /*@__PURE__*/ new Color( 0x000000 ) }, specular: { value: /*@__PURE__*/ new Color( 0x111111 ) }, @@ -89,6 +92,7 @@ const ShaderLib = { UniformsLib.metalnessmap, UniformsLib.fog, UniformsLib.lights, + UniformsLib.occlusion, { emissive: { value: /*@__PURE__*/ new Color( 0x000000 ) }, roughness: { value: 1.0 }, @@ -115,6 +119,7 @@ const ShaderLib = { UniformsLib.gradientmap, UniformsLib.fog, UniformsLib.lights, + UniformsLib.occlusion, { emissive: { value: /*@__PURE__*/ new Color( 0x000000 ) } } @@ -133,6 +138,7 @@ const ShaderLib = { UniformsLib.normalmap, UniformsLib.displacementmap, UniformsLib.fog, + UniformsLib.occlusion, { matcap: { value: null } } @@ -147,7 +153,8 @@ const ShaderLib = { uniforms: /*@__PURE__*/ mergeUniforms( [ UniformsLib.points, - UniformsLib.fog + UniformsLib.fog, + UniformsLib.occlusion ] ), vertexShader: ShaderChunk.points_vert, @@ -191,6 +198,7 @@ const ShaderLib = { UniformsLib.bumpmap, UniformsLib.normalmap, UniformsLib.displacementmap, + UniformsLib.occlusion, { opacity: { value: 1.0 } } diff --git a/src/renderers/shaders/ShaderLib/linedashed.glsl.js b/src/renderers/shaders/ShaderLib/linedashed.glsl.js index 42bfbb39ac9ff5..e76ae6b041ffcf 100644 --- a/src/renderers/shaders/ShaderLib/linedashed.glsl.js +++ b/src/renderers/shaders/ShaderLib/linedashed.glsl.js @@ -45,6 +45,7 @@ varying float vLineDistance; #include #include #include +#include void main() { @@ -70,6 +71,7 @@ void main() { #include #include #include + #include } `; diff --git a/src/renderers/shaders/ShaderLib/meshbasic.glsl.js b/src/renderers/shaders/ShaderLib/meshbasic.glsl.js index 052c2d0d8de8d9..683dff36068b8c 100644 --- a/src/renderers/shaders/ShaderLib/meshbasic.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshbasic.glsl.js @@ -66,6 +66,7 @@ uniform float opacity; #include #include #include +#include void main() { @@ -110,6 +111,7 @@ void main() { #include #include #include + #include } `; diff --git a/src/renderers/shaders/ShaderLib/meshlambert.glsl.js b/src/renderers/shaders/ShaderLib/meshlambert.glsl.js index 3fff7689b3601b..cfad220da9db27 100644 --- a/src/renderers/shaders/ShaderLib/meshlambert.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshlambert.glsl.js @@ -80,6 +80,7 @@ uniform float opacity; #include #include #include +#include void main() { @@ -118,6 +119,7 @@ void main() { #include #include #include + #include } `; diff --git a/src/renderers/shaders/ShaderLib/meshmatcap.glsl.js b/src/renderers/shaders/ShaderLib/meshmatcap.glsl.js index e4fc33876585a0..064dce47b1302a 100644 --- a/src/renderers/shaders/ShaderLib/meshmatcap.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshmatcap.glsl.js @@ -66,6 +66,7 @@ varying vec3 vViewPosition; #include #include #include +#include void main() { @@ -105,6 +106,7 @@ void main() { #include #include #include + #include } `; diff --git a/src/renderers/shaders/ShaderLib/meshnormal.glsl.js b/src/renderers/shaders/ShaderLib/meshnormal.glsl.js index 32d5eae0ae270e..95c4f110d0f7c4 100644 --- a/src/renderers/shaders/ShaderLib/meshnormal.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshnormal.glsl.js @@ -63,6 +63,7 @@ uniform float opacity; #include #include #include +#include void main() { @@ -79,5 +80,7 @@ void main() { #endif + #include + } `; diff --git a/src/renderers/shaders/ShaderLib/meshphong.glsl.js b/src/renderers/shaders/ShaderLib/meshphong.glsl.js index 9c412694d395f4..1c3ba83b73ddb2 100644 --- a/src/renderers/shaders/ShaderLib/meshphong.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshphong.glsl.js @@ -82,6 +82,7 @@ uniform float opacity; #include #include #include +#include void main() { @@ -120,6 +121,7 @@ void main() { #include #include #include + #include } `; diff --git a/src/renderers/shaders/ShaderLib/meshphysical.glsl.js b/src/renderers/shaders/ShaderLib/meshphysical.glsl.js index 241e5fc09e3077..15bbe599a21b94 100644 --- a/src/renderers/shaders/ShaderLib/meshphysical.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshphysical.glsl.js @@ -153,6 +153,7 @@ varying vec3 vViewPosition; #include #include #include +#include void main() { @@ -218,6 +219,7 @@ void main() { #include #include #include + #include } `; diff --git a/src/renderers/shaders/ShaderLib/meshtoon.glsl.js b/src/renderers/shaders/ShaderLib/meshtoon.glsl.js index de46e55b8d5ae0..05e989a127f419 100644 --- a/src/renderers/shaders/ShaderLib/meshtoon.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshtoon.glsl.js @@ -76,6 +76,7 @@ uniform float opacity; #include #include #include +#include void main() { @@ -112,6 +113,7 @@ void main() { #include #include #include + #include } `; diff --git a/src/renderers/shaders/ShaderLib/points.glsl.js b/src/renderers/shaders/ShaderLib/points.glsl.js index be07fd06ed84f4..63991f52de3ab6 100644 --- a/src/renderers/shaders/ShaderLib/points.glsl.js +++ b/src/renderers/shaders/ShaderLib/points.glsl.js @@ -60,6 +60,7 @@ uniform float opacity; #include #include #include +#include void main() { @@ -81,6 +82,7 @@ void main() { #include #include #include + #include } `; diff --git a/src/renderers/shaders/UniformsLib.js b/src/renderers/shaders/UniformsLib.js index 9b23c3f73d884c..62ae7bcd898f62 100644 --- a/src/renderers/shaders/UniformsLib.js +++ b/src/renderers/shaders/UniformsLib.js @@ -197,6 +197,12 @@ const UniformsLib = { }, + occlusion: { + depthColor: { value: null }, + depthWidth: {}, + depthHeight: {} + }, + points: { diffuse: { value: /*@__PURE__*/ new Color( 0xffffff ) }, diff --git a/src/renderers/webgl/WebGLMaterials.js b/src/renderers/webgl/WebGLMaterials.js index 2c2cc1ab585fe6..30186a09e4f545 100644 --- a/src/renderers/webgl/WebGLMaterials.js +++ b/src/renderers/webgl/WebGLMaterials.js @@ -32,6 +32,14 @@ function WebGLMaterials( renderer, properties ) { } + function refreshOcclusionUniforms( uniforms, occlusion ) { + + uniforms.depthColor.value = occlusion.depthColor; + uniforms.depthWidth.value = occlusion.depthWidth; + uniforms.depthHeight.value = occlusion.depthHeight; + + } + function refreshMaterialUniforms( uniforms, material, pixelRatio, height, transmissionRenderTarget ) { if ( material.isMeshBasicMaterial ) { @@ -559,7 +567,8 @@ function WebGLMaterials( renderer, properties ) { return { refreshFogUniforms: refreshFogUniforms, - refreshMaterialUniforms: refreshMaterialUniforms + refreshMaterialUniforms: refreshMaterialUniforms, + refreshOcclusionUniforms: refreshOcclusionUniforms }; } diff --git a/src/renderers/webgl/WebGLProgram.js b/src/renderers/webgl/WebGLProgram.js index 0f04631cd656b8..a5c9b438c545b0 100644 --- a/src/renderers/webgl/WebGLProgram.js +++ b/src/renderers/webgl/WebGLProgram.js @@ -510,6 +510,8 @@ function WebGLProgram( renderer, cacheKey, parameters, bindingStates ) { parameters.useFog && parameters.fog ? '#define USE_FOG' : '', parameters.useFog && parameters.fogExp2 ? '#define FOG_EXP2' : '', + parameters.occlusion ? '#define USE_OCCLUSION' : '', + parameters.map ? '#define USE_MAP' : '', parameters.envMap ? '#define USE_ENVMAP' : '', parameters.envMap ? '#define ' + envMapModeDefine : '', @@ -725,6 +727,8 @@ function WebGLProgram( renderer, cacheKey, parameters, bindingStates ) { parameters.useFog && parameters.fog ? '#define USE_FOG' : '', parameters.useFog && parameters.fogExp2 ? '#define FOG_EXP2' : '', + parameters.occlusion ? '#define USE_OCCLUSION' : '', + parameters.map ? '#define USE_MAP' : '', parameters.matcap ? '#define USE_MATCAP' : '', parameters.envMap ? '#define USE_ENVMAP' : '', diff --git a/src/renderers/webgl/WebGLPrograms.js b/src/renderers/webgl/WebGLPrograms.js index 4adbdc01988155..883cda27eed870 100644 --- a/src/renderers/webgl/WebGLPrograms.js +++ b/src/renderers/webgl/WebGLPrograms.js @@ -44,7 +44,7 @@ function WebGLPrograms( renderer, cubemaps, cubeuvmaps, extensions, capabilities } - function getParameters( material, lights, shadows, scene, object ) { + function getParameters( material, lights, shadows, scene, object, occlusion ) { const fog = scene.fog; const geometry = object.geometry; @@ -162,6 +162,8 @@ function WebGLPrograms( renderer, cubemaps, cubeuvmaps, extensions, capabilities const HAS_ATTRIBUTE_UV2 = !! geometry.attributes.uv2; const HAS_ATTRIBUTE_UV3 = !! geometry.attributes.uv3; + const HAS_OCCLUSION = !! occlusion; + let toneMapping = NoToneMapping; if ( material.toneMapped ) { @@ -253,6 +255,8 @@ function WebGLPrograms( renderer, cubemaps, cubeuvmaps, extensions, capabilities combine: material.combine, + occlusion: HAS_OCCLUSION, + // mapUv: HAS_MAP && getChannel( material.map.channel ), @@ -302,6 +306,8 @@ function WebGLPrograms( renderer, cubemaps, cubeuvmaps, extensions, capabilities useFog: material.fog === true, fogExp2: ( fog && fog.isFogExp2 ), + useOcclusion: material.occlusion === true, + flatShading: material.flatShading === true, sizeAttenuation: material.sizeAttenuation === true, @@ -405,6 +411,7 @@ function WebGLPrograms( renderer, cubemaps, cubeuvmaps, extensions, capabilities } array.push( parameters.customProgramCacheKey ); + array.push( parameters.occlusion ); return array.join(); diff --git a/src/renderers/webxr/WebXRManager.js b/src/renderers/webxr/WebXRManager.js index b026f022755820..be290d5ebe1e5d 100644 --- a/src/renderers/webxr/WebXRManager.js +++ b/src/renderers/webxr/WebXRManager.js @@ -1,6 +1,7 @@ import { ArrayCamera } from '../../cameras/ArrayCamera.js'; import { EventDispatcher } from '../../core/EventDispatcher.js'; import { PerspectiveCamera } from '../../cameras/PerspectiveCamera.js'; +import { Texture } from '../../textures/Texture.js'; import { Vector2 } from '../../math/Vector2.js'; import { Vector3 } from '../../math/Vector3.js'; import { Vector4 } from '../../math/Vector4.js'; @@ -33,6 +34,9 @@ class WebXRManager extends EventDispatcher { let glBinding = null; let glProjLayer = null; let glBaseLayer = null; + let _depthTexture = null; + let _nearOverride = 0; + let _farOverride = 0; let xrFrame = null; const attributes = gl.getContextAttributes(); let initialRenderTarget = null; @@ -163,10 +167,12 @@ class WebXRManager extends EventDispatcher { _currentDepthNear = null; _currentDepthFar = null; + _depthTexture = null; // restore framebuffer/rendering state renderer.setRenderTarget( initialRenderTarget ); + renderer.clearOcclusion(); glBaseLayer = null; glProjLayer = null; @@ -522,6 +528,13 @@ class WebXRManager extends EventDispatcher { if ( session === null ) return; + if ( _depthTexture ) { + + camera.near = _nearOverride; + camera.far = _farOverride; + + } + cameraXR.near = cameraR.near = cameraL.near = camera.near; cameraXR.far = cameraR.far = cameraL.far = camera.far; @@ -536,6 +549,14 @@ class WebXRManager extends EventDispatcher { _currentDepthNear = cameraXR.near; _currentDepthFar = cameraXR.far; + cameraL.near = _nearOverride; + cameraL.far = _farOverride; + cameraR.near = _nearOverride; + cameraR.far = _farOverride; + + cameraL.updateProjectionMatrix(); + cameraR.updateProjectionMatrix(); + camera.updateProjectionMatrix(); } @@ -638,6 +659,12 @@ class WebXRManager extends EventDispatcher { }; + this.getDepthTexture = function ( ) { + + return _depthTexture; + + }; + // Animation Loop let onAnimationFrameCallback = null; @@ -730,6 +757,41 @@ class WebXRManager extends EventDispatcher { } + let depthData = null; + if ( session.enabledFeatures && session.enabledFeatures.includes( 'depth-sensing' ) ) { + + depthData = glBinding.getDepthInformation( views[ 0 ] ); + + } + + if ( depthData && depthData.isValid ) { + + if ( _depthTexture === null ) { + + _depthTexture = depthData.texture; + + const depthTexture = new Texture(); + const texProps = renderer.properties.get( depthTexture ); + texProps.__webglTexture = _depthTexture; + + if ( ( depthData.depthNear != session.renderState.depthNear ) || ( depthData.depthFar != session.renderState.depthFar ) ) { + + _nearOverride = depthData.depthNear; + _farOverride = depthData.depthFar; + + } + + const viewport = cameraXR.cameras[ 0 ].viewport; + renderer.setOcclusion( { depthColor: depthTexture, depthWidth: viewport.z, depthHeight: viewport.w } ); + + } + + } else { + + _depthTexture = null; + + } + } // From b6ee92bcd8f20718c186120b7f19a3b68a1d4e47 Mon Sep 17 00:00:00 2001 From: Rik Cabanier Date: Thu, 9 Nov 2023 00:58:15 +0000 Subject: [PATCH 02/15] add support for depth sensing --- examples/webxr_xr_ballshooter.html | 2 +- examples/webxr_xr_cubes.html | 2 +- examples/webxr_xr_dragging.html | 2 +- src/materials/LineBasicMaterial.js | 4 + src/materials/MeshBasicMaterial.js | 4 + src/materials/MeshLambertMaterial.js | 4 + src/materials/MeshMatcapMaterial.js | 4 + src/materials/MeshPhongMaterial.js | 4 + src/materials/MeshStandardMaterial.js | 4 + src/materials/MeshToonMaterial.js | 4 + src/materials/PointsMaterial.js | 4 + src/materials/ShaderMaterial.js | 2 + src/renderers/WebGLRenderer.js | 27 +++++- src/renderers/shaders/ShaderChunk.js | 4 + .../ShaderChunk/occlusion_fragment.glsl.js | 20 ++++ .../occlusion_pars_fragment.glsl.js | 97 +++++++++++++++++++ src/renderers/shaders/ShaderLib.js | 12 ++- .../shaders/ShaderLib/linedashed.glsl.js | 2 + .../shaders/ShaderLib/meshbasic.glsl.js | 2 + .../shaders/ShaderLib/meshlambert.glsl.js | 2 + .../shaders/ShaderLib/meshmatcap.glsl.js | 2 + .../shaders/ShaderLib/meshnormal.glsl.js | 3 + .../shaders/ShaderLib/meshphong.glsl.js | 2 + .../shaders/ShaderLib/meshphysical.glsl.js | 2 + .../shaders/ShaderLib/meshtoon.glsl.js | 2 + .../shaders/ShaderLib/points.glsl.js | 2 + src/renderers/shaders/UniformsLib.js | 6 ++ src/renderers/webgl/WebGLMaterials.js | 11 ++- src/renderers/webgl/WebGLProgram.js | 4 + src/renderers/webgl/WebGLPrograms.js | 9 +- src/renderers/webxr/WebXRManager.js | 62 ++++++++++++ 31 files changed, 303 insertions(+), 8 deletions(-) create mode 100644 src/renderers/shaders/ShaderChunk/occlusion_fragment.glsl.js create mode 100644 src/renderers/shaders/ShaderChunk/occlusion_pars_fragment.glsl.js diff --git a/examples/webxr_xr_ballshooter.html b/examples/webxr_xr_ballshooter.html index e004525b3dce12..28e39f2df18181 100644 --- a/examples/webxr_xr_ballshooter.html +++ b/examples/webxr_xr_ballshooter.html @@ -81,7 +81,7 @@ controls.target.y = 1.6; controls.update(); - document.body.appendChild( XRButton.createButton( renderer ) ); + document.body.appendChild( XRButton.createButton( renderer, { 'optionalFeatures': [ 'depth-sensing'] } ) ); // controllers diff --git a/examples/webxr_xr_cubes.html b/examples/webxr_xr_cubes.html index 3e35132a330e40..d51514f950d99f 100644 --- a/examples/webxr_xr_cubes.html +++ b/examples/webxr_xr_cubes.html @@ -141,7 +141,7 @@ // - document.body.appendChild( XRButton.createButton( renderer ) ); + document.body.appendChild( XRButton.createButton( renderer, { 'optionalFeatures': [ 'depth-sensing'] } ) ); } diff --git a/examples/webxr_xr_dragging.html b/examples/webxr_xr_dragging.html index 5154bffbc87980..d27cea1b25ccf7 100644 --- a/examples/webxr_xr_dragging.html +++ b/examples/webxr_xr_dragging.html @@ -125,7 +125,7 @@ renderer.xr.enabled = true; container.appendChild( renderer.domElement ); - document.body.appendChild( XRButton.createButton( renderer ) ); + document.body.appendChild( XRButton.createButton( renderer, { 'optionalFeatures': [ 'depth-sensing'] } ) ); // controllers diff --git a/src/materials/LineBasicMaterial.js b/src/materials/LineBasicMaterial.js index b6cc7be93afff5..efd1e3201ee499 100644 --- a/src/materials/LineBasicMaterial.js +++ b/src/materials/LineBasicMaterial.js @@ -21,6 +21,8 @@ class LineBasicMaterial extends Material { this.fog = true; + this.occlusion = true; + this.setValues( parameters ); } @@ -40,6 +42,8 @@ class LineBasicMaterial extends Material { this.fog = source.fog; + this.occlusion = source.occlusion; + return this; } diff --git a/src/materials/MeshBasicMaterial.js b/src/materials/MeshBasicMaterial.js index b9f7c2b5706fdf..4fe13367e7e48c 100644 --- a/src/materials/MeshBasicMaterial.js +++ b/src/materials/MeshBasicMaterial.js @@ -38,6 +38,8 @@ class MeshBasicMaterial extends Material { this.fog = true; + this.occlusion = true; + this.setValues( parameters ); } @@ -72,6 +74,8 @@ class MeshBasicMaterial extends Material { this.fog = source.fog; + this.occlusion = source.occlusion; + return this; } diff --git a/src/materials/MeshLambertMaterial.js b/src/materials/MeshLambertMaterial.js index a7c3b05053b85c..3e1a8a4098a248 100644 --- a/src/materials/MeshLambertMaterial.js +++ b/src/materials/MeshLambertMaterial.js @@ -56,6 +56,8 @@ class MeshLambertMaterial extends Material { this.fog = true; + this.occlusion = true; + this.setValues( parameters ); } @@ -107,6 +109,8 @@ class MeshLambertMaterial extends Material { this.fog = source.fog; + this.occlusion = source.occlusion; + return this; } diff --git a/src/materials/MeshMatcapMaterial.js b/src/materials/MeshMatcapMaterial.js index 84030dcae04ab2..95004ab57a72e1 100644 --- a/src/materials/MeshMatcapMaterial.js +++ b/src/materials/MeshMatcapMaterial.js @@ -38,6 +38,8 @@ class MeshMatcapMaterial extends Material { this.fog = true; + this.occlusion = true; + this.setValues( parameters ); } @@ -72,6 +74,8 @@ class MeshMatcapMaterial extends Material { this.fog = source.fog; + this.occlusion = source.occlusion; + return this; } diff --git a/src/materials/MeshPhongMaterial.js b/src/materials/MeshPhongMaterial.js index 6dfe9e46c27c0d..3fe95f00546cf1 100644 --- a/src/materials/MeshPhongMaterial.js +++ b/src/materials/MeshPhongMaterial.js @@ -58,6 +58,8 @@ class MeshPhongMaterial extends Material { this.fog = true; + this.occlusion = true; + this.setValues( parameters ); } @@ -111,6 +113,8 @@ class MeshPhongMaterial extends Material { this.fog = source.fog; + this.occlusion = source.occlusion; + return this; } diff --git a/src/materials/MeshStandardMaterial.js b/src/materials/MeshStandardMaterial.js index 1821cf2ffa446a..9195b95907469d 100644 --- a/src/materials/MeshStandardMaterial.js +++ b/src/materials/MeshStandardMaterial.js @@ -60,6 +60,8 @@ class MeshStandardMaterial extends Material { this.fog = true; + this.occlusion = true; + this.setValues( parameters ); } @@ -115,6 +117,8 @@ class MeshStandardMaterial extends Material { this.fog = source.fog; + this.occlusion = source.occlusion; + return this; } diff --git a/src/materials/MeshToonMaterial.js b/src/materials/MeshToonMaterial.js index 2f9b2f9e273b5e..d894c49b15c628 100644 --- a/src/materials/MeshToonMaterial.js +++ b/src/materials/MeshToonMaterial.js @@ -50,6 +50,8 @@ class MeshToonMaterial extends Material { this.fog = true; + this.occlusion = true; + this.setValues( parameters ); } @@ -93,6 +95,8 @@ class MeshToonMaterial extends Material { this.fog = source.fog; + this.occlusion = source.occlusion; + return this; } diff --git a/src/materials/PointsMaterial.js b/src/materials/PointsMaterial.js index 8ca5500d6ee124..c689a7339b16c3 100644 --- a/src/materials/PointsMaterial.js +++ b/src/materials/PointsMaterial.js @@ -22,6 +22,8 @@ class PointsMaterial extends Material { this.fog = true; + this.occlusion = true; + this.setValues( parameters ); } @@ -41,6 +43,8 @@ class PointsMaterial extends Material { this.fog = source.fog; + this.occlusion = source.occlusion; + return this; } diff --git a/src/materials/ShaderMaterial.js b/src/materials/ShaderMaterial.js index c3370a67f11617..ebb2d5ed2b9f4c 100644 --- a/src/materials/ShaderMaterial.js +++ b/src/materials/ShaderMaterial.js @@ -80,6 +80,8 @@ class ShaderMaterial extends Material { this.lights = source.lights; this.clipping = source.clipping; + this.occlusion = source.occlusion; + this.extensions = Object.assign( {}, source.extensions ); this.glslVersion = source.glslVersion; diff --git a/src/renderers/WebGLRenderer.js b/src/renderers/WebGLRenderer.js index 6babb4c3f59b07..58c53e6d53f9fa 100644 --- a/src/renderers/WebGLRenderer.js +++ b/src/renderers/WebGLRenderer.js @@ -210,6 +210,7 @@ class WebGLRenderer { const _vector3 = new Vector3(); const _emptyScene = { background: null, fog: null, environment: null, overrideMaterial: null, isScene: true }; + let _occlusion = null; function getTargetPixelRatio() { @@ -415,6 +416,20 @@ class WebGLRenderer { }; + this.setOcclusion = function ( value ) { + + if ( value === undefined ) return; + + _occlusion = value; + + }; + + this.clearOcclusion = function () { + + _occlusion = null; + + }; + this.getSize = function ( target ) { return target.set( _width, _height ); @@ -1600,7 +1615,7 @@ class WebGLRenderer { const lightsStateVersion = lights.state.version; - const parameters = programCache.getParameters( material, lights.state, shadowsArray, scene, object ); + const parameters = programCache.getParameters( material, lights.state, shadowsArray, scene, object, _occlusion ); const programCacheKey = programCache.getProgramCacheKey( parameters ); let programs = materialProperties.programs; @@ -1840,6 +1855,10 @@ class WebGLRenderer { needsProgramChange = true; + } else if ( material.occlusion === true ) { + + needsProgramChange = true; + } else if ( materialProperties.numClippingPlanes !== undefined && ( materialProperties.numClippingPlanes !== clipping.numPlanes || materialProperties.numIntersection !== clipping.numIntersection ) ) { @@ -2054,6 +2073,12 @@ class WebGLRenderer { } + if ( _occlusion && material.occlusion === true ) { + + materials.refreshOcclusionUniforms( m_uniforms, _occlusion ); + + } + materials.refreshMaterialUniforms( m_uniforms, material, _pixelRatio, _height, _transmissionRenderTarget ); WebGLUniforms.upload( _gl, getUniformList( materialProperties ), m_uniforms, textures ); diff --git a/src/renderers/shaders/ShaderChunk.js b/src/renderers/shaders/ShaderChunk.js index a943c12965170c..33e6f15fd8919e 100644 --- a/src/renderers/shaders/ShaderChunk.js +++ b/src/renderers/shaders/ShaderChunk.js @@ -75,6 +75,8 @@ import normal_pars_fragment from './ShaderChunk/normal_pars_fragment.glsl.js'; import normal_pars_vertex from './ShaderChunk/normal_pars_vertex.glsl.js'; import normal_vertex from './ShaderChunk/normal_vertex.glsl.js'; import normalmap_pars_fragment from './ShaderChunk/normalmap_pars_fragment.glsl.js'; +import occlusion_fragment from './ShaderChunk/occlusion_fragment.glsl.js'; +import occlusion_pars_fragment from './ShaderChunk/occlusion_pars_fragment.glsl.js'; import clearcoat_normal_fragment_begin from './ShaderChunk/clearcoat_normal_fragment_begin.glsl.js'; import clearcoat_normal_fragment_maps from './ShaderChunk/clearcoat_normal_fragment_maps.glsl.js'; import clearcoat_pars_fragment from './ShaderChunk/clearcoat_pars_fragment.glsl.js'; @@ -202,6 +204,8 @@ export const ShaderChunk = { normal_pars_vertex: normal_pars_vertex, normal_vertex: normal_vertex, normalmap_pars_fragment: normalmap_pars_fragment, + occlusion_fragment: occlusion_fragment, + occlusion_pars_fragment: occlusion_pars_fragment, clearcoat_normal_fragment_begin: clearcoat_normal_fragment_begin, clearcoat_normal_fragment_maps: clearcoat_normal_fragment_maps, clearcoat_pars_fragment: clearcoat_pars_fragment, diff --git a/src/renderers/shaders/ShaderChunk/occlusion_fragment.glsl.js b/src/renderers/shaders/ShaderChunk/occlusion_fragment.glsl.js new file mode 100644 index 00000000000000..62b7b59603efb4 --- /dev/null +++ b/src/renderers/shaders/ShaderChunk/occlusion_fragment.glsl.js @@ -0,0 +1,20 @@ +export default /* glsl */` +#ifdef USE_OCCLUSION + if (gl_FragColor.a > 0.0) { + int arrayIndex = 0; + vec2 depthUv; + if (gl_FragCoord.x>=depthWidth) { + arrayIndex = 1; + depthUv = vec2((gl_FragCoord.x-depthWidth)/depthWidth, gl_FragCoord.y/depthHeight); + } else { + depthUv = vec2(gl_FragCoord.x/depthWidth, gl_FragCoord.y/depthHeight); + } + float assetDepthM = gl_FragCoord.z; + + //float occlusion = Depth_GetOcclusion(depthColor, depthUv, assetDepthM, arrayIndex); + float occlusion = Depth_GetBlurredOcclusionAroundUV(depthColor, depthUv, assetDepthM, arrayIndex); + + gl_FragColor *= 1.0 - occlusion; + } +#endif +`; diff --git a/src/renderers/shaders/ShaderChunk/occlusion_pars_fragment.glsl.js b/src/renderers/shaders/ShaderChunk/occlusion_pars_fragment.glsl.js new file mode 100644 index 00000000000000..b1441c71a10302 --- /dev/null +++ b/src/renderers/shaders/ShaderChunk/occlusion_pars_fragment.glsl.js @@ -0,0 +1,97 @@ +export default /* glsl */` +#ifdef USE_OCCLUSION + uniform sampler2DArray depthColor; + uniform float depthWidth; + uniform float depthHeight; + + float Depth_GetCameraDepthInMeters(const sampler2DArray depthTexture, + const vec2 depthUv, int arrayIndex) { + return texture(depthColor, vec3(depthUv.x, depthUv.y, arrayIndex)).r; + } + + float Depth_GetOcclusion(const sampler2DArray depthTexture, const vec2 depthUv, float assetDepthM, int arrayIndex) { + float depthMm = Depth_GetCameraDepthInMeters(depthTexture, depthUv, arrayIndex); + + // Instead of a hard z-buffer test, allow the asset to fade into the + // background along a 2 * kDepthTolerancePerM * assetDepthM + // range centered on the background depth. + const float kDepthTolerancePerM = 0.001; + return clamp(1.0 - + 0.5 * (depthMm - assetDepthM) / + (kDepthTolerancePerM * assetDepthM) + + 0.5, 0.0, 1.0); + } + + float Depth_GetBlurredOcclusionAroundUV(const sampler2DArray depthTexture, const vec2 uv, float assetDepthM, int arrayIndex) { + // Kernel used: + // 0 4 7 4 0 + // 4 16 26 16 4 + // 7 26 41 26 7 + // 4 16 26 16 4 + // 0 4 7 4 0 + const float kKernelTotalWeights = 269.0; + float sum = 0.0; + + const float kOcclusionBlurAmount = 0.0005; + vec2 blurriness = + vec2(kOcclusionBlurAmount, kOcclusionBlurAmount /** u_DepthAspectRatio*/); + + float current = 0.0; + + current += Depth_GetOcclusion( + depthTexture, uv + vec2(-1.0, -2.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(+1.0, -2.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(-1.0, +2.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(+1.0, +2.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(-2.0, +1.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(+2.0, +1.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(-2.0, -1.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(+2.0, -1.0) * blurriness, assetDepthM, arrayIndex); + sum += current * 4.0; + + current = 0.0; + current += Depth_GetOcclusion( + depthTexture, uv + vec2(-2.0, -0.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(+2.0, +0.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(+0.0, +2.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(-0.0, -2.0) * blurriness, assetDepthM, arrayIndex); + sum += current * 7.0; + + current = 0.0; + current += Depth_GetOcclusion( + depthTexture, uv + vec2(-1.0, -1.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(+1.0, -1.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(-1.0, +1.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(+1.0, +1.0) * blurriness, assetDepthM, arrayIndex); + sum += current * 16.0; + + current = 0.0; + current += Depth_GetOcclusion( + depthTexture, uv + vec2(+0.0, +1.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(-0.0, -1.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(-1.0, -0.0) * blurriness, assetDepthM, arrayIndex); + current += Depth_GetOcclusion( + depthTexture, uv + vec2(+1.0, +0.0) * blurriness, assetDepthM, arrayIndex); + sum += current * 26.0; + + sum += Depth_GetOcclusion(depthTexture, uv, assetDepthM, arrayIndex) * 41.0; + + return sum / kKernelTotalWeights; + } +#endif +`; diff --git a/src/renderers/shaders/ShaderLib.js b/src/renderers/shaders/ShaderLib.js index 0ed7018ee9577c..1e80a37a41c655 100644 --- a/src/renderers/shaders/ShaderLib.js +++ b/src/renderers/shaders/ShaderLib.js @@ -16,7 +16,8 @@ const ShaderLib = { UniformsLib.envmap, UniformsLib.aomap, UniformsLib.lightmap, - UniformsLib.fog + UniformsLib.fog, + UniformsLib.occlusion ] ), vertexShader: ShaderChunk.meshbasic_vert, @@ -38,6 +39,7 @@ const ShaderLib = { UniformsLib.displacementmap, UniformsLib.fog, UniformsLib.lights, + UniformsLib.occlusion, { emissive: { value: /*@__PURE__*/ new Color( 0x000000 ) } } @@ -62,6 +64,7 @@ const ShaderLib = { UniformsLib.displacementmap, UniformsLib.fog, UniformsLib.lights, + UniformsLib.occlusion, { emissive: { value: /*@__PURE__*/ new Color( 0x000000 ) }, specular: { value: /*@__PURE__*/ new Color( 0x111111 ) }, @@ -89,6 +92,7 @@ const ShaderLib = { UniformsLib.metalnessmap, UniformsLib.fog, UniformsLib.lights, + UniformsLib.occlusion, { emissive: { value: /*@__PURE__*/ new Color( 0x000000 ) }, roughness: { value: 1.0 }, @@ -115,6 +119,7 @@ const ShaderLib = { UniformsLib.gradientmap, UniformsLib.fog, UniformsLib.lights, + UniformsLib.occlusion, { emissive: { value: /*@__PURE__*/ new Color( 0x000000 ) } } @@ -133,6 +138,7 @@ const ShaderLib = { UniformsLib.normalmap, UniformsLib.displacementmap, UniformsLib.fog, + UniformsLib.occlusion, { matcap: { value: null } } @@ -147,7 +153,8 @@ const ShaderLib = { uniforms: /*@__PURE__*/ mergeUniforms( [ UniformsLib.points, - UniformsLib.fog + UniformsLib.fog, + UniformsLib.occlusion ] ), vertexShader: ShaderChunk.points_vert, @@ -191,6 +198,7 @@ const ShaderLib = { UniformsLib.bumpmap, UniformsLib.normalmap, UniformsLib.displacementmap, + UniformsLib.occlusion, { opacity: { value: 1.0 } } diff --git a/src/renderers/shaders/ShaderLib/linedashed.glsl.js b/src/renderers/shaders/ShaderLib/linedashed.glsl.js index 42bfbb39ac9ff5..e76ae6b041ffcf 100644 --- a/src/renderers/shaders/ShaderLib/linedashed.glsl.js +++ b/src/renderers/shaders/ShaderLib/linedashed.glsl.js @@ -45,6 +45,7 @@ varying float vLineDistance; #include #include #include +#include void main() { @@ -70,6 +71,7 @@ void main() { #include #include #include + #include } `; diff --git a/src/renderers/shaders/ShaderLib/meshbasic.glsl.js b/src/renderers/shaders/ShaderLib/meshbasic.glsl.js index 72c611e1934267..51eb75f1022238 100644 --- a/src/renderers/shaders/ShaderLib/meshbasic.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshbasic.glsl.js @@ -67,6 +67,7 @@ uniform float opacity; #include #include #include +#include void main() { @@ -111,6 +112,7 @@ void main() { #include #include #include + #include } `; diff --git a/src/renderers/shaders/ShaderLib/meshlambert.glsl.js b/src/renderers/shaders/ShaderLib/meshlambert.glsl.js index c6f4c6249ad94d..3ec9e2cfb3aaa4 100644 --- a/src/renderers/shaders/ShaderLib/meshlambert.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshlambert.glsl.js @@ -81,6 +81,7 @@ uniform float opacity; #include #include #include +#include void main() { @@ -119,6 +120,7 @@ void main() { #include #include #include + #include } `; diff --git a/src/renderers/shaders/ShaderLib/meshmatcap.glsl.js b/src/renderers/shaders/ShaderLib/meshmatcap.glsl.js index be310c28767acf..82c7e70def4684 100644 --- a/src/renderers/shaders/ShaderLib/meshmatcap.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshmatcap.glsl.js @@ -68,6 +68,7 @@ varying vec3 vViewPosition; #include #include #include +#include void main() { @@ -107,6 +108,7 @@ void main() { #include #include #include + #include } `; diff --git a/src/renderers/shaders/ShaderLib/meshnormal.glsl.js b/src/renderers/shaders/ShaderLib/meshnormal.glsl.js index 09d91eda04534f..66a8ce777802aa 100644 --- a/src/renderers/shaders/ShaderLib/meshnormal.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshnormal.glsl.js @@ -64,6 +64,7 @@ uniform float opacity; #include #include #include +#include void main() { @@ -80,5 +81,7 @@ void main() { #endif + #include + } `; diff --git a/src/renderers/shaders/ShaderLib/meshphong.glsl.js b/src/renderers/shaders/ShaderLib/meshphong.glsl.js index 61ccad801f90c1..0ece36414439e5 100644 --- a/src/renderers/shaders/ShaderLib/meshphong.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshphong.glsl.js @@ -83,6 +83,7 @@ uniform float opacity; #include #include #include +#include void main() { @@ -121,6 +122,7 @@ void main() { #include #include #include + #include } `; diff --git a/src/renderers/shaders/ShaderLib/meshphysical.glsl.js b/src/renderers/shaders/ShaderLib/meshphysical.glsl.js index 0708b112d2552a..c8d81acb853e7e 100644 --- a/src/renderers/shaders/ShaderLib/meshphysical.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshphysical.glsl.js @@ -154,6 +154,7 @@ varying vec3 vViewPosition; #include #include #include +#include void main() { @@ -219,6 +220,7 @@ void main() { #include #include #include + #include } `; diff --git a/src/renderers/shaders/ShaderLib/meshtoon.glsl.js b/src/renderers/shaders/ShaderLib/meshtoon.glsl.js index 1df200691efe01..6743093ff73694 100644 --- a/src/renderers/shaders/ShaderLib/meshtoon.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshtoon.glsl.js @@ -77,6 +77,7 @@ uniform float opacity; #include #include #include +#include void main() { @@ -113,6 +114,7 @@ void main() { #include #include #include + #include } `; diff --git a/src/renderers/shaders/ShaderLib/points.glsl.js b/src/renderers/shaders/ShaderLib/points.glsl.js index be07fd06ed84f4..63991f52de3ab6 100644 --- a/src/renderers/shaders/ShaderLib/points.glsl.js +++ b/src/renderers/shaders/ShaderLib/points.glsl.js @@ -60,6 +60,7 @@ uniform float opacity; #include #include #include +#include void main() { @@ -81,6 +82,7 @@ void main() { #include #include #include + #include } `; diff --git a/src/renderers/shaders/UniformsLib.js b/src/renderers/shaders/UniformsLib.js index 9b23c3f73d884c..62ae7bcd898f62 100644 --- a/src/renderers/shaders/UniformsLib.js +++ b/src/renderers/shaders/UniformsLib.js @@ -197,6 +197,12 @@ const UniformsLib = { }, + occlusion: { + depthColor: { value: null }, + depthWidth: {}, + depthHeight: {} + }, + points: { diffuse: { value: /*@__PURE__*/ new Color( 0xffffff ) }, diff --git a/src/renderers/webgl/WebGLMaterials.js b/src/renderers/webgl/WebGLMaterials.js index 2c2cc1ab585fe6..30186a09e4f545 100644 --- a/src/renderers/webgl/WebGLMaterials.js +++ b/src/renderers/webgl/WebGLMaterials.js @@ -32,6 +32,14 @@ function WebGLMaterials( renderer, properties ) { } + function refreshOcclusionUniforms( uniforms, occlusion ) { + + uniforms.depthColor.value = occlusion.depthColor; + uniforms.depthWidth.value = occlusion.depthWidth; + uniforms.depthHeight.value = occlusion.depthHeight; + + } + function refreshMaterialUniforms( uniforms, material, pixelRatio, height, transmissionRenderTarget ) { if ( material.isMeshBasicMaterial ) { @@ -559,7 +567,8 @@ function WebGLMaterials( renderer, properties ) { return { refreshFogUniforms: refreshFogUniforms, - refreshMaterialUniforms: refreshMaterialUniforms + refreshMaterialUniforms: refreshMaterialUniforms, + refreshOcclusionUniforms: refreshOcclusionUniforms }; } diff --git a/src/renderers/webgl/WebGLProgram.js b/src/renderers/webgl/WebGLProgram.js index 6285e619df47c2..b35d0fb43961c3 100644 --- a/src/renderers/webgl/WebGLProgram.js +++ b/src/renderers/webgl/WebGLProgram.js @@ -550,6 +550,8 @@ function WebGLProgram( renderer, cacheKey, parameters, bindingStates ) { parameters.useFog && parameters.fog ? '#define USE_FOG' : '', parameters.useFog && parameters.fogExp2 ? '#define FOG_EXP2' : '', + parameters.occlusion ? '#define USE_OCCLUSION' : '', + parameters.map ? '#define USE_MAP' : '', parameters.envMap ? '#define USE_ENVMAP' : '', parameters.envMap ? '#define ' + envMapModeDefine : '', @@ -765,6 +767,8 @@ function WebGLProgram( renderer, cacheKey, parameters, bindingStates ) { parameters.useFog && parameters.fog ? '#define USE_FOG' : '', parameters.useFog && parameters.fogExp2 ? '#define FOG_EXP2' : '', + parameters.occlusion ? '#define USE_OCCLUSION' : '', + parameters.map ? '#define USE_MAP' : '', parameters.matcap ? '#define USE_MATCAP' : '', parameters.envMap ? '#define USE_ENVMAP' : '', diff --git a/src/renderers/webgl/WebGLPrograms.js b/src/renderers/webgl/WebGLPrograms.js index d153ff64514406..95bb03d6df7e33 100644 --- a/src/renderers/webgl/WebGLPrograms.js +++ b/src/renderers/webgl/WebGLPrograms.js @@ -44,7 +44,7 @@ function WebGLPrograms( renderer, cubemaps, cubeuvmaps, extensions, capabilities } - function getParameters( material, lights, shadows, scene, object ) { + function getParameters( material, lights, shadows, scene, object, occlusion ) { const fog = scene.fog; const geometry = object.geometry; @@ -162,6 +162,8 @@ function WebGLPrograms( renderer, cubemaps, cubeuvmaps, extensions, capabilities const HAS_ATTRIBUTE_UV2 = !! geometry.attributes.uv2; const HAS_ATTRIBUTE_UV3 = !! geometry.attributes.uv3; + const HAS_OCCLUSION = !! occlusion; + let toneMapping = NoToneMapping; if ( material.toneMapped ) { @@ -253,6 +255,8 @@ function WebGLPrograms( renderer, cubemaps, cubeuvmaps, extensions, capabilities combine: material.combine, + occlusion: HAS_OCCLUSION, + // mapUv: HAS_MAP && getChannel( material.map.channel ), @@ -302,6 +306,8 @@ function WebGLPrograms( renderer, cubemaps, cubeuvmaps, extensions, capabilities useFog: material.fog === true, fogExp2: ( !! fog && fog.isFogExp2 ), + useOcclusion: material.occlusion === true, + flatShading: material.flatShading === true, sizeAttenuation: material.sizeAttenuation === true, @@ -406,6 +412,7 @@ function WebGLPrograms( renderer, cubemaps, cubeuvmaps, extensions, capabilities } array.push( parameters.customProgramCacheKey ); + array.push( parameters.occlusion ); return array.join(); diff --git a/src/renderers/webxr/WebXRManager.js b/src/renderers/webxr/WebXRManager.js index b026f022755820..be290d5ebe1e5d 100644 --- a/src/renderers/webxr/WebXRManager.js +++ b/src/renderers/webxr/WebXRManager.js @@ -1,6 +1,7 @@ import { ArrayCamera } from '../../cameras/ArrayCamera.js'; import { EventDispatcher } from '../../core/EventDispatcher.js'; import { PerspectiveCamera } from '../../cameras/PerspectiveCamera.js'; +import { Texture } from '../../textures/Texture.js'; import { Vector2 } from '../../math/Vector2.js'; import { Vector3 } from '../../math/Vector3.js'; import { Vector4 } from '../../math/Vector4.js'; @@ -33,6 +34,9 @@ class WebXRManager extends EventDispatcher { let glBinding = null; let glProjLayer = null; let glBaseLayer = null; + let _depthTexture = null; + let _nearOverride = 0; + let _farOverride = 0; let xrFrame = null; const attributes = gl.getContextAttributes(); let initialRenderTarget = null; @@ -163,10 +167,12 @@ class WebXRManager extends EventDispatcher { _currentDepthNear = null; _currentDepthFar = null; + _depthTexture = null; // restore framebuffer/rendering state renderer.setRenderTarget( initialRenderTarget ); + renderer.clearOcclusion(); glBaseLayer = null; glProjLayer = null; @@ -522,6 +528,13 @@ class WebXRManager extends EventDispatcher { if ( session === null ) return; + if ( _depthTexture ) { + + camera.near = _nearOverride; + camera.far = _farOverride; + + } + cameraXR.near = cameraR.near = cameraL.near = camera.near; cameraXR.far = cameraR.far = cameraL.far = camera.far; @@ -536,6 +549,14 @@ class WebXRManager extends EventDispatcher { _currentDepthNear = cameraXR.near; _currentDepthFar = cameraXR.far; + cameraL.near = _nearOverride; + cameraL.far = _farOverride; + cameraR.near = _nearOverride; + cameraR.far = _farOverride; + + cameraL.updateProjectionMatrix(); + cameraR.updateProjectionMatrix(); + camera.updateProjectionMatrix(); } @@ -638,6 +659,12 @@ class WebXRManager extends EventDispatcher { }; + this.getDepthTexture = function ( ) { + + return _depthTexture; + + }; + // Animation Loop let onAnimationFrameCallback = null; @@ -730,6 +757,41 @@ class WebXRManager extends EventDispatcher { } + let depthData = null; + if ( session.enabledFeatures && session.enabledFeatures.includes( 'depth-sensing' ) ) { + + depthData = glBinding.getDepthInformation( views[ 0 ] ); + + } + + if ( depthData && depthData.isValid ) { + + if ( _depthTexture === null ) { + + _depthTexture = depthData.texture; + + const depthTexture = new Texture(); + const texProps = renderer.properties.get( depthTexture ); + texProps.__webglTexture = _depthTexture; + + if ( ( depthData.depthNear != session.renderState.depthNear ) || ( depthData.depthFar != session.renderState.depthFar ) ) { + + _nearOverride = depthData.depthNear; + _farOverride = depthData.depthFar; + + } + + const viewport = cameraXR.cameras[ 0 ].viewport; + renderer.setOcclusion( { depthColor: depthTexture, depthWidth: viewport.z, depthHeight: viewport.w } ); + + } + + } else { + + _depthTexture = null; + + } + } // From fad7c393175f844fbd0069549089b94100022988 Mon Sep 17 00:00:00 2001 From: Rik Cabanier Date: Thu, 18 Jan 2024 18:04:01 +0000 Subject: [PATCH 03/15] use EXT_frag_depth for depth sensing --- src/materials/LineBasicMaterial.js | 4 - src/materials/MeshBasicMaterial.js | 4 - src/materials/MeshLambertMaterial.js | 4 - src/materials/MeshMatcapMaterial.js | 4 - src/materials/MeshPhongMaterial.js | 4 - src/materials/MeshStandardMaterial.js | 4 - src/materials/MeshToonMaterial.js | 4 - src/materials/PointsMaterial.js | 4 - src/materials/ShaderMaterial.js | 2 - src/renderers/WebGLRenderer.js | 33 ++----- src/renderers/shaders/ShaderChunk.js | 4 - .../ShaderChunk/occlusion_fragment.glsl.js | 20 ---- .../occlusion_pars_fragment.glsl.js | 97 ------------------- src/renderers/shaders/ShaderLib.js | 12 +-- .../shaders/ShaderLib/linedashed.glsl.js | 2 - .../shaders/ShaderLib/meshbasic.glsl.js | 2 - .../shaders/ShaderLib/meshlambert.glsl.js | 2 - .../shaders/ShaderLib/meshmatcap.glsl.js | 2 - .../shaders/ShaderLib/meshnormal.glsl.js | 3 - .../shaders/ShaderLib/meshphong.glsl.js | 2 - .../shaders/ShaderLib/meshphysical.glsl.js | 2 - .../shaders/ShaderLib/meshtoon.glsl.js | 2 - .../shaders/ShaderLib/points.glsl.js | 2 - src/renderers/shaders/UniformsLib.js | 6 -- src/renderers/webgl/WebGLMaterials.js | 11 +-- src/renderers/webgl/WebGLProgram.js | 4 - src/renderers/webgl/WebGLPrograms.js | 11 +-- src/renderers/webxr/WebXRManager.js | 84 +++++++++++++--- 28 files changed, 80 insertions(+), 255 deletions(-) delete mode 100644 src/renderers/shaders/ShaderChunk/occlusion_fragment.glsl.js delete mode 100644 src/renderers/shaders/ShaderChunk/occlusion_pars_fragment.glsl.js diff --git a/src/materials/LineBasicMaterial.js b/src/materials/LineBasicMaterial.js index efd1e3201ee499..b6cc7be93afff5 100644 --- a/src/materials/LineBasicMaterial.js +++ b/src/materials/LineBasicMaterial.js @@ -21,8 +21,6 @@ class LineBasicMaterial extends Material { this.fog = true; - this.occlusion = true; - this.setValues( parameters ); } @@ -42,8 +40,6 @@ class LineBasicMaterial extends Material { this.fog = source.fog; - this.occlusion = source.occlusion; - return this; } diff --git a/src/materials/MeshBasicMaterial.js b/src/materials/MeshBasicMaterial.js index 4fe13367e7e48c..b9f7c2b5706fdf 100644 --- a/src/materials/MeshBasicMaterial.js +++ b/src/materials/MeshBasicMaterial.js @@ -38,8 +38,6 @@ class MeshBasicMaterial extends Material { this.fog = true; - this.occlusion = true; - this.setValues( parameters ); } @@ -74,8 +72,6 @@ class MeshBasicMaterial extends Material { this.fog = source.fog; - this.occlusion = source.occlusion; - return this; } diff --git a/src/materials/MeshLambertMaterial.js b/src/materials/MeshLambertMaterial.js index 3e1a8a4098a248..a7c3b05053b85c 100644 --- a/src/materials/MeshLambertMaterial.js +++ b/src/materials/MeshLambertMaterial.js @@ -56,8 +56,6 @@ class MeshLambertMaterial extends Material { this.fog = true; - this.occlusion = true; - this.setValues( parameters ); } @@ -109,8 +107,6 @@ class MeshLambertMaterial extends Material { this.fog = source.fog; - this.occlusion = source.occlusion; - return this; } diff --git a/src/materials/MeshMatcapMaterial.js b/src/materials/MeshMatcapMaterial.js index 95004ab57a72e1..84030dcae04ab2 100644 --- a/src/materials/MeshMatcapMaterial.js +++ b/src/materials/MeshMatcapMaterial.js @@ -38,8 +38,6 @@ class MeshMatcapMaterial extends Material { this.fog = true; - this.occlusion = true; - this.setValues( parameters ); } @@ -74,8 +72,6 @@ class MeshMatcapMaterial extends Material { this.fog = source.fog; - this.occlusion = source.occlusion; - return this; } diff --git a/src/materials/MeshPhongMaterial.js b/src/materials/MeshPhongMaterial.js index 3fe95f00546cf1..6dfe9e46c27c0d 100644 --- a/src/materials/MeshPhongMaterial.js +++ b/src/materials/MeshPhongMaterial.js @@ -58,8 +58,6 @@ class MeshPhongMaterial extends Material { this.fog = true; - this.occlusion = true; - this.setValues( parameters ); } @@ -113,8 +111,6 @@ class MeshPhongMaterial extends Material { this.fog = source.fog; - this.occlusion = source.occlusion; - return this; } diff --git a/src/materials/MeshStandardMaterial.js b/src/materials/MeshStandardMaterial.js index 9195b95907469d..1821cf2ffa446a 100644 --- a/src/materials/MeshStandardMaterial.js +++ b/src/materials/MeshStandardMaterial.js @@ -60,8 +60,6 @@ class MeshStandardMaterial extends Material { this.fog = true; - this.occlusion = true; - this.setValues( parameters ); } @@ -117,8 +115,6 @@ class MeshStandardMaterial extends Material { this.fog = source.fog; - this.occlusion = source.occlusion; - return this; } diff --git a/src/materials/MeshToonMaterial.js b/src/materials/MeshToonMaterial.js index d894c49b15c628..2f9b2f9e273b5e 100644 --- a/src/materials/MeshToonMaterial.js +++ b/src/materials/MeshToonMaterial.js @@ -50,8 +50,6 @@ class MeshToonMaterial extends Material { this.fog = true; - this.occlusion = true; - this.setValues( parameters ); } @@ -95,8 +93,6 @@ class MeshToonMaterial extends Material { this.fog = source.fog; - this.occlusion = source.occlusion; - return this; } diff --git a/src/materials/PointsMaterial.js b/src/materials/PointsMaterial.js index c689a7339b16c3..8ca5500d6ee124 100644 --- a/src/materials/PointsMaterial.js +++ b/src/materials/PointsMaterial.js @@ -22,8 +22,6 @@ class PointsMaterial extends Material { this.fog = true; - this.occlusion = true; - this.setValues( parameters ); } @@ -43,8 +41,6 @@ class PointsMaterial extends Material { this.fog = source.fog; - this.occlusion = source.occlusion; - return this; } diff --git a/src/materials/ShaderMaterial.js b/src/materials/ShaderMaterial.js index ebb2d5ed2b9f4c..c3370a67f11617 100644 --- a/src/materials/ShaderMaterial.js +++ b/src/materials/ShaderMaterial.js @@ -80,8 +80,6 @@ class ShaderMaterial extends Material { this.lights = source.lights; this.clipping = source.clipping; - this.occlusion = source.occlusion; - this.extensions = Object.assign( {}, source.extensions ); this.glslVersion = source.glslVersion; diff --git a/src/renderers/WebGLRenderer.js b/src/renderers/WebGLRenderer.js index 58c53e6d53f9fa..3c6b25b1272b0a 100644 --- a/src/renderers/WebGLRenderer.js +++ b/src/renderers/WebGLRenderer.js @@ -210,7 +210,6 @@ class WebGLRenderer { const _vector3 = new Vector3(); const _emptyScene = { background: null, fog: null, environment: null, overrideMaterial: null, isScene: true }; - let _occlusion = null; function getTargetPixelRatio() { @@ -416,20 +415,6 @@ class WebGLRenderer { }; - this.setOcclusion = function ( value ) { - - if ( value === undefined ) return; - - _occlusion = value; - - }; - - this.clearOcclusion = function () { - - _occlusion = null; - - }; - this.getSize = function ( target ) { return target.set( _width, _height ); @@ -1224,7 +1209,11 @@ class WebGLRenderer { // - background.render( currentRenderList, scene ); + if ( xr.enabled === false || xr.isPresenting === false || xr.hasOcclusion() === false ) { + + background.render( currentRenderList, scene ); + + } // render scene @@ -1615,7 +1604,7 @@ class WebGLRenderer { const lightsStateVersion = lights.state.version; - const parameters = programCache.getParameters( material, lights.state, shadowsArray, scene, object, _occlusion ); + const parameters = programCache.getParameters( material, lights.state, shadowsArray, scene, object ); const programCacheKey = programCache.getProgramCacheKey( parameters ); let programs = materialProperties.programs; @@ -1855,10 +1844,6 @@ class WebGLRenderer { needsProgramChange = true; - } else if ( material.occlusion === true ) { - - needsProgramChange = true; - } else if ( materialProperties.numClippingPlanes !== undefined && ( materialProperties.numClippingPlanes !== clipping.numPlanes || materialProperties.numIntersection !== clipping.numIntersection ) ) { @@ -2073,12 +2058,6 @@ class WebGLRenderer { } - if ( _occlusion && material.occlusion === true ) { - - materials.refreshOcclusionUniforms( m_uniforms, _occlusion ); - - } - materials.refreshMaterialUniforms( m_uniforms, material, _pixelRatio, _height, _transmissionRenderTarget ); WebGLUniforms.upload( _gl, getUniformList( materialProperties ), m_uniforms, textures ); diff --git a/src/renderers/shaders/ShaderChunk.js b/src/renderers/shaders/ShaderChunk.js index 33e6f15fd8919e..a943c12965170c 100644 --- a/src/renderers/shaders/ShaderChunk.js +++ b/src/renderers/shaders/ShaderChunk.js @@ -75,8 +75,6 @@ import normal_pars_fragment from './ShaderChunk/normal_pars_fragment.glsl.js'; import normal_pars_vertex from './ShaderChunk/normal_pars_vertex.glsl.js'; import normal_vertex from './ShaderChunk/normal_vertex.glsl.js'; import normalmap_pars_fragment from './ShaderChunk/normalmap_pars_fragment.glsl.js'; -import occlusion_fragment from './ShaderChunk/occlusion_fragment.glsl.js'; -import occlusion_pars_fragment from './ShaderChunk/occlusion_pars_fragment.glsl.js'; import clearcoat_normal_fragment_begin from './ShaderChunk/clearcoat_normal_fragment_begin.glsl.js'; import clearcoat_normal_fragment_maps from './ShaderChunk/clearcoat_normal_fragment_maps.glsl.js'; import clearcoat_pars_fragment from './ShaderChunk/clearcoat_pars_fragment.glsl.js'; @@ -204,8 +202,6 @@ export const ShaderChunk = { normal_pars_vertex: normal_pars_vertex, normal_vertex: normal_vertex, normalmap_pars_fragment: normalmap_pars_fragment, - occlusion_fragment: occlusion_fragment, - occlusion_pars_fragment: occlusion_pars_fragment, clearcoat_normal_fragment_begin: clearcoat_normal_fragment_begin, clearcoat_normal_fragment_maps: clearcoat_normal_fragment_maps, clearcoat_pars_fragment: clearcoat_pars_fragment, diff --git a/src/renderers/shaders/ShaderChunk/occlusion_fragment.glsl.js b/src/renderers/shaders/ShaderChunk/occlusion_fragment.glsl.js deleted file mode 100644 index 62b7b59603efb4..00000000000000 --- a/src/renderers/shaders/ShaderChunk/occlusion_fragment.glsl.js +++ /dev/null @@ -1,20 +0,0 @@ -export default /* glsl */` -#ifdef USE_OCCLUSION - if (gl_FragColor.a > 0.0) { - int arrayIndex = 0; - vec2 depthUv; - if (gl_FragCoord.x>=depthWidth) { - arrayIndex = 1; - depthUv = vec2((gl_FragCoord.x-depthWidth)/depthWidth, gl_FragCoord.y/depthHeight); - } else { - depthUv = vec2(gl_FragCoord.x/depthWidth, gl_FragCoord.y/depthHeight); - } - float assetDepthM = gl_FragCoord.z; - - //float occlusion = Depth_GetOcclusion(depthColor, depthUv, assetDepthM, arrayIndex); - float occlusion = Depth_GetBlurredOcclusionAroundUV(depthColor, depthUv, assetDepthM, arrayIndex); - - gl_FragColor *= 1.0 - occlusion; - } -#endif -`; diff --git a/src/renderers/shaders/ShaderChunk/occlusion_pars_fragment.glsl.js b/src/renderers/shaders/ShaderChunk/occlusion_pars_fragment.glsl.js deleted file mode 100644 index b1441c71a10302..00000000000000 --- a/src/renderers/shaders/ShaderChunk/occlusion_pars_fragment.glsl.js +++ /dev/null @@ -1,97 +0,0 @@ -export default /* glsl */` -#ifdef USE_OCCLUSION - uniform sampler2DArray depthColor; - uniform float depthWidth; - uniform float depthHeight; - - float Depth_GetCameraDepthInMeters(const sampler2DArray depthTexture, - const vec2 depthUv, int arrayIndex) { - return texture(depthColor, vec3(depthUv.x, depthUv.y, arrayIndex)).r; - } - - float Depth_GetOcclusion(const sampler2DArray depthTexture, const vec2 depthUv, float assetDepthM, int arrayIndex) { - float depthMm = Depth_GetCameraDepthInMeters(depthTexture, depthUv, arrayIndex); - - // Instead of a hard z-buffer test, allow the asset to fade into the - // background along a 2 * kDepthTolerancePerM * assetDepthM - // range centered on the background depth. - const float kDepthTolerancePerM = 0.001; - return clamp(1.0 - - 0.5 * (depthMm - assetDepthM) / - (kDepthTolerancePerM * assetDepthM) + - 0.5, 0.0, 1.0); - } - - float Depth_GetBlurredOcclusionAroundUV(const sampler2DArray depthTexture, const vec2 uv, float assetDepthM, int arrayIndex) { - // Kernel used: - // 0 4 7 4 0 - // 4 16 26 16 4 - // 7 26 41 26 7 - // 4 16 26 16 4 - // 0 4 7 4 0 - const float kKernelTotalWeights = 269.0; - float sum = 0.0; - - const float kOcclusionBlurAmount = 0.0005; - vec2 blurriness = - vec2(kOcclusionBlurAmount, kOcclusionBlurAmount /** u_DepthAspectRatio*/); - - float current = 0.0; - - current += Depth_GetOcclusion( - depthTexture, uv + vec2(-1.0, -2.0) * blurriness, assetDepthM, arrayIndex); - current += Depth_GetOcclusion( - depthTexture, uv + vec2(+1.0, -2.0) * blurriness, assetDepthM, arrayIndex); - current += Depth_GetOcclusion( - depthTexture, uv + vec2(-1.0, +2.0) * blurriness, assetDepthM, arrayIndex); - current += Depth_GetOcclusion( - depthTexture, uv + vec2(+1.0, +2.0) * blurriness, assetDepthM, arrayIndex); - current += Depth_GetOcclusion( - depthTexture, uv + vec2(-2.0, +1.0) * blurriness, assetDepthM, arrayIndex); - current += Depth_GetOcclusion( - depthTexture, uv + vec2(+2.0, +1.0) * blurriness, assetDepthM, arrayIndex); - current += Depth_GetOcclusion( - depthTexture, uv + vec2(-2.0, -1.0) * blurriness, assetDepthM, arrayIndex); - current += Depth_GetOcclusion( - depthTexture, uv + vec2(+2.0, -1.0) * blurriness, assetDepthM, arrayIndex); - sum += current * 4.0; - - current = 0.0; - current += Depth_GetOcclusion( - depthTexture, uv + vec2(-2.0, -0.0) * blurriness, assetDepthM, arrayIndex); - current += Depth_GetOcclusion( - depthTexture, uv + vec2(+2.0, +0.0) * blurriness, assetDepthM, arrayIndex); - current += Depth_GetOcclusion( - depthTexture, uv + vec2(+0.0, +2.0) * blurriness, assetDepthM, arrayIndex); - current += Depth_GetOcclusion( - depthTexture, uv + vec2(-0.0, -2.0) * blurriness, assetDepthM, arrayIndex); - sum += current * 7.0; - - current = 0.0; - current += Depth_GetOcclusion( - depthTexture, uv + vec2(-1.0, -1.0) * blurriness, assetDepthM, arrayIndex); - current += Depth_GetOcclusion( - depthTexture, uv + vec2(+1.0, -1.0) * blurriness, assetDepthM, arrayIndex); - current += Depth_GetOcclusion( - depthTexture, uv + vec2(-1.0, +1.0) * blurriness, assetDepthM, arrayIndex); - current += Depth_GetOcclusion( - depthTexture, uv + vec2(+1.0, +1.0) * blurriness, assetDepthM, arrayIndex); - sum += current * 16.0; - - current = 0.0; - current += Depth_GetOcclusion( - depthTexture, uv + vec2(+0.0, +1.0) * blurriness, assetDepthM, arrayIndex); - current += Depth_GetOcclusion( - depthTexture, uv + vec2(-0.0, -1.0) * blurriness, assetDepthM, arrayIndex); - current += Depth_GetOcclusion( - depthTexture, uv + vec2(-1.0, -0.0) * blurriness, assetDepthM, arrayIndex); - current += Depth_GetOcclusion( - depthTexture, uv + vec2(+1.0, +0.0) * blurriness, assetDepthM, arrayIndex); - sum += current * 26.0; - - sum += Depth_GetOcclusion(depthTexture, uv, assetDepthM, arrayIndex) * 41.0; - - return sum / kKernelTotalWeights; - } -#endif -`; diff --git a/src/renderers/shaders/ShaderLib.js b/src/renderers/shaders/ShaderLib.js index 1e80a37a41c655..0ed7018ee9577c 100644 --- a/src/renderers/shaders/ShaderLib.js +++ b/src/renderers/shaders/ShaderLib.js @@ -16,8 +16,7 @@ const ShaderLib = { UniformsLib.envmap, UniformsLib.aomap, UniformsLib.lightmap, - UniformsLib.fog, - UniformsLib.occlusion + UniformsLib.fog ] ), vertexShader: ShaderChunk.meshbasic_vert, @@ -39,7 +38,6 @@ const ShaderLib = { UniformsLib.displacementmap, UniformsLib.fog, UniformsLib.lights, - UniformsLib.occlusion, { emissive: { value: /*@__PURE__*/ new Color( 0x000000 ) } } @@ -64,7 +62,6 @@ const ShaderLib = { UniformsLib.displacementmap, UniformsLib.fog, UniformsLib.lights, - UniformsLib.occlusion, { emissive: { value: /*@__PURE__*/ new Color( 0x000000 ) }, specular: { value: /*@__PURE__*/ new Color( 0x111111 ) }, @@ -92,7 +89,6 @@ const ShaderLib = { UniformsLib.metalnessmap, UniformsLib.fog, UniformsLib.lights, - UniformsLib.occlusion, { emissive: { value: /*@__PURE__*/ new Color( 0x000000 ) }, roughness: { value: 1.0 }, @@ -119,7 +115,6 @@ const ShaderLib = { UniformsLib.gradientmap, UniformsLib.fog, UniformsLib.lights, - UniformsLib.occlusion, { emissive: { value: /*@__PURE__*/ new Color( 0x000000 ) } } @@ -138,7 +133,6 @@ const ShaderLib = { UniformsLib.normalmap, UniformsLib.displacementmap, UniformsLib.fog, - UniformsLib.occlusion, { matcap: { value: null } } @@ -153,8 +147,7 @@ const ShaderLib = { uniforms: /*@__PURE__*/ mergeUniforms( [ UniformsLib.points, - UniformsLib.fog, - UniformsLib.occlusion + UniformsLib.fog ] ), vertexShader: ShaderChunk.points_vert, @@ -198,7 +191,6 @@ const ShaderLib = { UniformsLib.bumpmap, UniformsLib.normalmap, UniformsLib.displacementmap, - UniformsLib.occlusion, { opacity: { value: 1.0 } } diff --git a/src/renderers/shaders/ShaderLib/linedashed.glsl.js b/src/renderers/shaders/ShaderLib/linedashed.glsl.js index e76ae6b041ffcf..42bfbb39ac9ff5 100644 --- a/src/renderers/shaders/ShaderLib/linedashed.glsl.js +++ b/src/renderers/shaders/ShaderLib/linedashed.glsl.js @@ -45,7 +45,6 @@ varying float vLineDistance; #include #include #include -#include void main() { @@ -71,7 +70,6 @@ void main() { #include #include #include - #include } `; diff --git a/src/renderers/shaders/ShaderLib/meshbasic.glsl.js b/src/renderers/shaders/ShaderLib/meshbasic.glsl.js index 51eb75f1022238..72c611e1934267 100644 --- a/src/renderers/shaders/ShaderLib/meshbasic.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshbasic.glsl.js @@ -67,7 +67,6 @@ uniform float opacity; #include #include #include -#include void main() { @@ -112,7 +111,6 @@ void main() { #include #include #include - #include } `; diff --git a/src/renderers/shaders/ShaderLib/meshlambert.glsl.js b/src/renderers/shaders/ShaderLib/meshlambert.glsl.js index 3ec9e2cfb3aaa4..c6f4c6249ad94d 100644 --- a/src/renderers/shaders/ShaderLib/meshlambert.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshlambert.glsl.js @@ -81,7 +81,6 @@ uniform float opacity; #include #include #include -#include void main() { @@ -120,7 +119,6 @@ void main() { #include #include #include - #include } `; diff --git a/src/renderers/shaders/ShaderLib/meshmatcap.glsl.js b/src/renderers/shaders/ShaderLib/meshmatcap.glsl.js index 82c7e70def4684..be310c28767acf 100644 --- a/src/renderers/shaders/ShaderLib/meshmatcap.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshmatcap.glsl.js @@ -68,7 +68,6 @@ varying vec3 vViewPosition; #include #include #include -#include void main() { @@ -108,7 +107,6 @@ void main() { #include #include #include - #include } `; diff --git a/src/renderers/shaders/ShaderLib/meshnormal.glsl.js b/src/renderers/shaders/ShaderLib/meshnormal.glsl.js index 66a8ce777802aa..09d91eda04534f 100644 --- a/src/renderers/shaders/ShaderLib/meshnormal.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshnormal.glsl.js @@ -64,7 +64,6 @@ uniform float opacity; #include #include #include -#include void main() { @@ -81,7 +80,5 @@ void main() { #endif - #include - } `; diff --git a/src/renderers/shaders/ShaderLib/meshphong.glsl.js b/src/renderers/shaders/ShaderLib/meshphong.glsl.js index 0ece36414439e5..61ccad801f90c1 100644 --- a/src/renderers/shaders/ShaderLib/meshphong.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshphong.glsl.js @@ -83,7 +83,6 @@ uniform float opacity; #include #include #include -#include void main() { @@ -122,7 +121,6 @@ void main() { #include #include #include - #include } `; diff --git a/src/renderers/shaders/ShaderLib/meshphysical.glsl.js b/src/renderers/shaders/ShaderLib/meshphysical.glsl.js index c8d81acb853e7e..0708b112d2552a 100644 --- a/src/renderers/shaders/ShaderLib/meshphysical.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshphysical.glsl.js @@ -154,7 +154,6 @@ varying vec3 vViewPosition; #include #include #include -#include void main() { @@ -220,7 +219,6 @@ void main() { #include #include #include - #include } `; diff --git a/src/renderers/shaders/ShaderLib/meshtoon.glsl.js b/src/renderers/shaders/ShaderLib/meshtoon.glsl.js index 6743093ff73694..1df200691efe01 100644 --- a/src/renderers/shaders/ShaderLib/meshtoon.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshtoon.glsl.js @@ -77,7 +77,6 @@ uniform float opacity; #include #include #include -#include void main() { @@ -114,7 +113,6 @@ void main() { #include #include #include - #include } `; diff --git a/src/renderers/shaders/ShaderLib/points.glsl.js b/src/renderers/shaders/ShaderLib/points.glsl.js index 63991f52de3ab6..be07fd06ed84f4 100644 --- a/src/renderers/shaders/ShaderLib/points.glsl.js +++ b/src/renderers/shaders/ShaderLib/points.glsl.js @@ -60,7 +60,6 @@ uniform float opacity; #include #include #include -#include void main() { @@ -82,7 +81,6 @@ void main() { #include #include #include - #include } `; diff --git a/src/renderers/shaders/UniformsLib.js b/src/renderers/shaders/UniformsLib.js index 62ae7bcd898f62..9b23c3f73d884c 100644 --- a/src/renderers/shaders/UniformsLib.js +++ b/src/renderers/shaders/UniformsLib.js @@ -197,12 +197,6 @@ const UniformsLib = { }, - occlusion: { - depthColor: { value: null }, - depthWidth: {}, - depthHeight: {} - }, - points: { diffuse: { value: /*@__PURE__*/ new Color( 0xffffff ) }, diff --git a/src/renderers/webgl/WebGLMaterials.js b/src/renderers/webgl/WebGLMaterials.js index 30186a09e4f545..2c2cc1ab585fe6 100644 --- a/src/renderers/webgl/WebGLMaterials.js +++ b/src/renderers/webgl/WebGLMaterials.js @@ -32,14 +32,6 @@ function WebGLMaterials( renderer, properties ) { } - function refreshOcclusionUniforms( uniforms, occlusion ) { - - uniforms.depthColor.value = occlusion.depthColor; - uniforms.depthWidth.value = occlusion.depthWidth; - uniforms.depthHeight.value = occlusion.depthHeight; - - } - function refreshMaterialUniforms( uniforms, material, pixelRatio, height, transmissionRenderTarget ) { if ( material.isMeshBasicMaterial ) { @@ -567,8 +559,7 @@ function WebGLMaterials( renderer, properties ) { return { refreshFogUniforms: refreshFogUniforms, - refreshMaterialUniforms: refreshMaterialUniforms, - refreshOcclusionUniforms: refreshOcclusionUniforms + refreshMaterialUniforms: refreshMaterialUniforms }; } diff --git a/src/renderers/webgl/WebGLProgram.js b/src/renderers/webgl/WebGLProgram.js index b35d0fb43961c3..6285e619df47c2 100644 --- a/src/renderers/webgl/WebGLProgram.js +++ b/src/renderers/webgl/WebGLProgram.js @@ -550,8 +550,6 @@ function WebGLProgram( renderer, cacheKey, parameters, bindingStates ) { parameters.useFog && parameters.fog ? '#define USE_FOG' : '', parameters.useFog && parameters.fogExp2 ? '#define FOG_EXP2' : '', - parameters.occlusion ? '#define USE_OCCLUSION' : '', - parameters.map ? '#define USE_MAP' : '', parameters.envMap ? '#define USE_ENVMAP' : '', parameters.envMap ? '#define ' + envMapModeDefine : '', @@ -767,8 +765,6 @@ function WebGLProgram( renderer, cacheKey, parameters, bindingStates ) { parameters.useFog && parameters.fog ? '#define USE_FOG' : '', parameters.useFog && parameters.fogExp2 ? '#define FOG_EXP2' : '', - parameters.occlusion ? '#define USE_OCCLUSION' : '', - parameters.map ? '#define USE_MAP' : '', parameters.matcap ? '#define USE_MATCAP' : '', parameters.envMap ? '#define USE_ENVMAP' : '', diff --git a/src/renderers/webgl/WebGLPrograms.js b/src/renderers/webgl/WebGLPrograms.js index 1006f24d37ff5c..d153ff64514406 100644 --- a/src/renderers/webgl/WebGLPrograms.js +++ b/src/renderers/webgl/WebGLPrograms.js @@ -44,7 +44,7 @@ function WebGLPrograms( renderer, cubemaps, cubeuvmaps, extensions, capabilities } - function getParameters( material, lights, shadows, scene, object, occlusion ) { + function getParameters( material, lights, shadows, scene, object ) { const fog = scene.fog; const geometry = object.geometry; @@ -162,8 +162,6 @@ function WebGLPrograms( renderer, cubemaps, cubeuvmaps, extensions, capabilities const HAS_ATTRIBUTE_UV2 = !! geometry.attributes.uv2; const HAS_ATTRIBUTE_UV3 = !! geometry.attributes.uv3; - const HAS_OCCLUSION = !! occlusion; - let toneMapping = NoToneMapping; if ( material.toneMapped ) { @@ -255,8 +253,6 @@ function WebGLPrograms( renderer, cubemaps, cubeuvmaps, extensions, capabilities combine: material.combine, - occlusion: HAS_OCCLUSION, - // mapUv: HAS_MAP && getChannel( material.map.channel ), @@ -306,10 +302,6 @@ function WebGLPrograms( renderer, cubemaps, cubeuvmaps, extensions, capabilities useFog: material.fog === true, fogExp2: ( !! fog && fog.isFogExp2 ), - useOcclusion: material.occlusion === true, - - useOcclusion: material.occlusion === true, - flatShading: material.flatShading === true, sizeAttenuation: material.sizeAttenuation === true, @@ -414,7 +406,6 @@ function WebGLPrograms( renderer, cubemaps, cubeuvmaps, extensions, capabilities } array.push( parameters.customProgramCacheKey ); - array.push( parameters.occlusion ); return array.join(); diff --git a/src/renderers/webxr/WebXRManager.js b/src/renderers/webxr/WebXRManager.js index be290d5ebe1e5d..602fbf4765c073 100644 --- a/src/renderers/webxr/WebXRManager.js +++ b/src/renderers/webxr/WebXRManager.js @@ -10,8 +10,39 @@ import { WebGLAnimation } from '../webgl/WebGLAnimation.js'; import { WebGLRenderTarget } from '../WebGLRenderTarget.js'; import { WebXRController } from './WebXRController.js'; import { DepthTexture } from '../../textures/DepthTexture.js'; +import { ShaderMaterial } from '../../materials/ShaderMaterial.js'; +import { PlaneGeometry } from '../../geometries/PlaneGeometry.js'; +import { Mesh } from '../../objects/Mesh.js'; +import { Scene } from '../../scenes/Scene.js'; import { DepthFormat, DepthStencilFormat, RGBAFormat, UnsignedByteType, UnsignedIntType, UnsignedInt248Type } from '../../constants.js'; +const _occlusion_vertex = ` +void main() { + + gl_Position = vec4(position, 1.0); + +}`; + +const _occlusion_fragment = ` +uniform sampler2DArray depthColor; +uniform float depthWidth; +uniform float depthHeight; + +void main() { + + int arrayIndex = 0; + vec2 depthUv; + if (gl_FragCoord.x>=depthWidth) { + arrayIndex = 1; + depthUv = vec2((gl_FragCoord.x-depthWidth)/depthWidth, gl_FragCoord.y/depthHeight); + } else { + depthUv = vec2(gl_FragCoord.x/depthWidth, gl_FragCoord.y/depthHeight); + } + + gl_FragDepthEXT = texture(depthColor, vec3(depthUv.x, depthUv.y, arrayIndex)).r; + +}`; + class WebXRManager extends EventDispatcher { constructor( renderer, gl ) { @@ -38,6 +69,10 @@ class WebXRManager extends EventDispatcher { let _nearOverride = 0; let _farOverride = 0; let xrFrame = null; + + let _occlusionDepthTexture = null; + let _occlusionScene = null; + const attributes = gl.getContextAttributes(); let initialRenderTarget = null; let newRenderTarget = null; @@ -168,11 +203,12 @@ class WebXRManager extends EventDispatcher { _currentDepthNear = null; _currentDepthFar = null; _depthTexture = null; + _occlusionDepthTexture = null; + _occlusionScene = null; // restore framebuffer/rendering state renderer.setRenderTarget( initialRenderTarget ); - renderer.clearOcclusion(); glBaseLayer = null; glProjLayer = null; @@ -659,9 +695,9 @@ class WebXRManager extends EventDispatcher { }; - this.getDepthTexture = function ( ) { + this.hasOcclusion = function ( ) { - return _depthTexture; + return _occlusionDepthTexture !== null; }; @@ -764,14 +800,14 @@ class WebXRManager extends EventDispatcher { } - if ( depthData && depthData.isValid ) { + if ( depthData && depthData.isValid && depthData.texture ) { - if ( _depthTexture === null ) { + if ( _occlusionDepthTexture === null ) { _depthTexture = depthData.texture; - const depthTexture = new Texture(); - const texProps = renderer.properties.get( depthTexture ); + _occlusionDepthTexture = new Texture(); + const texProps = renderer.properties.get( _occlusionDepthTexture ); texProps.__webglTexture = _depthTexture; if ( ( depthData.depthNear != session.renderState.depthNear ) || ( depthData.depthFar != session.renderState.depthFar ) ) { @@ -781,15 +817,8 @@ class WebXRManager extends EventDispatcher { } - const viewport = cameraXR.cameras[ 0 ].viewport; - renderer.setOcclusion( { depthColor: depthTexture, depthWidth: viewport.z, depthHeight: viewport.w } ); - } - } else { - - _depthTexture = null; - } } @@ -809,6 +838,33 @@ class WebXRManager extends EventDispatcher { } + if ( _occlusionDepthTexture ) { + + if ( ! _occlusionScene ) { + + const viewport = cameraXR.cameras[ 0 ].viewport; + const occlusionMaterial = new ShaderMaterial( { + vertexShader: _occlusion_vertex, + fragmentShader: _occlusion_fragment, + uniforms: { + depthColor: { value: _occlusionDepthTexture }, + depthWidth: { value: viewport.z }, + depthHeight: { value: viewport.w } + } + } ); + + occlusionMaterial.extensions.fragDepth = true; + + _occlusionScene = new Scene(); + _occlusionScene.add( new Mesh( new PlaneGeometry( 20, 20 ), occlusionMaterial ) ); + _occlusionScene.isScene = false; + + } + + renderer.render( _occlusionScene, cameraXR ); + + } + if ( onAnimationFrameCallback ) onAnimationFrameCallback( time, frame ); if ( frame.detectedPlanes ) { From b97b1fc4e71df5e449cf17511d969a40dfcc69a7 Mon Sep 17 00:00:00 2001 From: mrdoob Date: Tue, 30 Jan 2024 15:34:52 +0900 Subject: [PATCH 04/15] Create WebXRDepthSensing --- src/renderers/webxr/WebXRDepthSensing | 106 ++++++++++++++++++++++++++ 1 file changed, 106 insertions(+) create mode 100644 src/renderers/webxr/WebXRDepthSensing diff --git a/src/renderers/webxr/WebXRDepthSensing b/src/renderers/webxr/WebXRDepthSensing new file mode 100644 index 00000000000000..b15fef955c22b6 --- /dev/null +++ b/src/renderers/webxr/WebXRDepthSensing @@ -0,0 +1,106 @@ +import { PlaneGeometry } from '../../geometries/PlaneGeometry.js'; +import { ShaderMaterial } from '../../materials/ShaderMaterial.js'; +import { Mesh } from '../../objects/Mesh.js'; +import { Scene } from '../../scenes/Scene.js'; +import { Texture } from '../../textures/Texture.js'; + +const _occlusion_vertex = ` +void main() { + + gl_Position = vec4(position, 1.0); + +}`; + +const _occlusion_fragment = ` +uniform sampler2DArray depthColor; +uniform float depthWidth; +uniform float depthHeight; + +void main() { + + int arrayIndex = 0; + vec2 depthUv; + if (gl_FragCoord.x>=depthWidth) { + arrayIndex = 1; + depthUv = vec2((gl_FragCoord.x-depthWidth)/depthWidth, gl_FragCoord.y/depthHeight); + } else { + depthUv = vec2(gl_FragCoord.x/depthWidth, gl_FragCoord.y/depthHeight); + } + + gl_FragDepthEXT = texture(depthColor, vec3(depthUv.x, depthUv.y, arrayIndex)).r; + +}`; + +class WebXRDepthSensing { + + constructor() { + + this.texture = null; + this.mesh = null; + + this.depthNear = 0; + this.depthFar = 0; + + } + + init( renderer, session, depthData ) { + + if ( this.texture === null ) { + + const texture = new Texture(); + + const texProps = renderer.properties.get( texture ); + texProps.__webglTexture = depthData.texture; + + if ( ( depthData.depthNear != session.renderState.depthNear ) || ( depthData.depthFar != session.renderState.depthFar ) ) { + + this.depthNear = depthData.depthNear; + this.depthFar = depthData.depthFar; + + } + + this.texture = texture; + + } + + } + + render( renderer, cameraXR ) { + + if ( this.texture !== null ) { + + if ( this.mesh === null ) { + + const viewport = cameraXR.cameras[ 0 ].viewport; + const occlusionMaterial = new ShaderMaterial( { + vertexShader: _occlusion_vertex, + fragmentShader: _occlusion_fragment, + uniforms: { + depthColor: { value: this.texture }, + depthWidth: { value: viewport.z }, + depthHeight: { value: viewport.w } + } + } ); + + occlusionMaterial.extensions.fragDepth = true; + + this.mesh = new Mesh( new PlaneGeometry( 20, 20 ), occlusionMaterial ); + + } + + renderer.render( this.mesh, cameraXR ); + + } + + } + + reset() { + + this.texture = null; + this.mesh = null; + + } + +} + +export { WebXRDepthSensing }; From 226ddd6e9a29cb022316ffe8b6f52771c8ad16d7 Mon Sep 17 00:00:00 2001 From: mrdoob Date: Tue, 30 Jan 2024 15:35:06 +0900 Subject: [PATCH 05/15] Rename WebXRDepthSensing to WebXRDepthSensing.js --- src/renderers/webxr/{WebXRDepthSensing => WebXRDepthSensing.js} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename src/renderers/webxr/{WebXRDepthSensing => WebXRDepthSensing.js} (100%) diff --git a/src/renderers/webxr/WebXRDepthSensing b/src/renderers/webxr/WebXRDepthSensing.js similarity index 100% rename from src/renderers/webxr/WebXRDepthSensing rename to src/renderers/webxr/WebXRDepthSensing.js From 13f6fafda121873286b3122916c1590f8cb720be Mon Sep 17 00:00:00 2001 From: mrdoob Date: Tue, 30 Jan 2024 15:35:40 +0900 Subject: [PATCH 06/15] Update WebXRManager.js --- src/renderers/webxr/WebXRManager.js | 114 +++++----------------------- 1 file changed, 20 insertions(+), 94 deletions(-) diff --git a/src/renderers/webxr/WebXRManager.js b/src/renderers/webxr/WebXRManager.js index 602fbf4765c073..86ceacb185a808 100644 --- a/src/renderers/webxr/WebXRManager.js +++ b/src/renderers/webxr/WebXRManager.js @@ -1,7 +1,6 @@ import { ArrayCamera } from '../../cameras/ArrayCamera.js'; import { EventDispatcher } from '../../core/EventDispatcher.js'; import { PerspectiveCamera } from '../../cameras/PerspectiveCamera.js'; -import { Texture } from '../../textures/Texture.js'; import { Vector2 } from '../../math/Vector2.js'; import { Vector3 } from '../../math/Vector3.js'; import { Vector4 } from '../../math/Vector4.js'; @@ -10,38 +9,8 @@ import { WebGLAnimation } from '../webgl/WebGLAnimation.js'; import { WebGLRenderTarget } from '../WebGLRenderTarget.js'; import { WebXRController } from './WebXRController.js'; import { DepthTexture } from '../../textures/DepthTexture.js'; -import { ShaderMaterial } from '../../materials/ShaderMaterial.js'; -import { PlaneGeometry } from '../../geometries/PlaneGeometry.js'; -import { Mesh } from '../../objects/Mesh.js'; -import { Scene } from '../../scenes/Scene.js'; import { DepthFormat, DepthStencilFormat, RGBAFormat, UnsignedByteType, UnsignedIntType, UnsignedInt248Type } from '../../constants.js'; - -const _occlusion_vertex = ` -void main() { - - gl_Position = vec4(position, 1.0); - -}`; - -const _occlusion_fragment = ` -uniform sampler2DArray depthColor; -uniform float depthWidth; -uniform float depthHeight; - -void main() { - - int arrayIndex = 0; - vec2 depthUv; - if (gl_FragCoord.x>=depthWidth) { - arrayIndex = 1; - depthUv = vec2((gl_FragCoord.x-depthWidth)/depthWidth, gl_FragCoord.y/depthHeight); - } else { - depthUv = vec2(gl_FragCoord.x/depthWidth, gl_FragCoord.y/depthHeight); - } - - gl_FragDepthEXT = texture(depthColor, vec3(depthUv.x, depthUv.y, arrayIndex)).r; - -}`; +import { WebXRDepthSensing } from './WebXRDepthSensing.js'; class WebXRManager extends EventDispatcher { @@ -65,15 +34,11 @@ class WebXRManager extends EventDispatcher { let glBinding = null; let glProjLayer = null; let glBaseLayer = null; - let _depthTexture = null; - let _nearOverride = 0; - let _farOverride = 0; let xrFrame = null; - let _occlusionDepthTexture = null; - let _occlusionScene = null; - + const depthSensing = new WebXRDepthSensing( renderer ); const attributes = gl.getContextAttributes(); + let initialRenderTarget = null; let newRenderTarget = null; @@ -202,9 +167,8 @@ class WebXRManager extends EventDispatcher { _currentDepthNear = null; _currentDepthFar = null; - _depthTexture = null; - _occlusionDepthTexture = null; - _occlusionScene = null; + + depthSensing.reset(); // restore framebuffer/rendering state @@ -564,10 +528,10 @@ class WebXRManager extends EventDispatcher { if ( session === null ) return; - if ( _depthTexture ) { + if ( depthSensing.texture !== null ) { - camera.near = _nearOverride; - camera.far = _farOverride; + camera.near = depthSensing.depthNear; + camera.far = depthSensing.depthFar; } @@ -585,10 +549,11 @@ class WebXRManager extends EventDispatcher { _currentDepthNear = cameraXR.near; _currentDepthFar = cameraXR.far; - cameraL.near = _nearOverride; - cameraL.far = _farOverride; - cameraR.near = _nearOverride; - cameraR.far = _farOverride; + + cameraL.near = depthSensing.depthNear; // ? + cameraL.far = depthSensing.depthFar; // ? + cameraR.near = depthSensing.depthNear; // ? + cameraR.far = depthSensing.depthFar; // ? cameraL.updateProjectionMatrix(); cameraR.updateProjectionMatrix(); @@ -697,7 +662,7 @@ class WebXRManager extends EventDispatcher { this.hasOcclusion = function ( ) { - return _occlusionDepthTexture !== null; + return depthSensing.texture !== null; }; @@ -793,29 +758,15 @@ class WebXRManager extends EventDispatcher { } - let depthData = null; - if ( session.enabledFeatures && session.enabledFeatures.includes( 'depth-sensing' ) ) { - - depthData = glBinding.getDepthInformation( views[ 0 ] ); - - } - - if ( depthData && depthData.isValid && depthData.texture ) { - - if ( _occlusionDepthTexture === null ) { - - _depthTexture = depthData.texture; + // - _occlusionDepthTexture = new Texture(); - const texProps = renderer.properties.get( _occlusionDepthTexture ); - texProps.__webglTexture = _depthTexture; + if ( session.enabledFeatures && session.enabledFeatures.includes( 'depth-sensing' ) ) { - if ( ( depthData.depthNear != session.renderState.depthNear ) || ( depthData.depthFar != session.renderState.depthFar ) ) { + const depthData = glBinding.getDepthInformation( views[ 0 ] ); - _nearOverride = depthData.depthNear; - _farOverride = depthData.depthFar; + if ( depthData && depthData.isValid && depthData.texture ) { - } + depthSensing.init( renderer, session, depthData ); } @@ -838,32 +789,7 @@ class WebXRManager extends EventDispatcher { } - if ( _occlusionDepthTexture ) { - - if ( ! _occlusionScene ) { - - const viewport = cameraXR.cameras[ 0 ].viewport; - const occlusionMaterial = new ShaderMaterial( { - vertexShader: _occlusion_vertex, - fragmentShader: _occlusion_fragment, - uniforms: { - depthColor: { value: _occlusionDepthTexture }, - depthWidth: { value: viewport.z }, - depthHeight: { value: viewport.w } - } - } ); - - occlusionMaterial.extensions.fragDepth = true; - - _occlusionScene = new Scene(); - _occlusionScene.add( new Mesh( new PlaneGeometry( 20, 20 ), occlusionMaterial ) ); - _occlusionScene.isScene = false; - - } - - renderer.render( _occlusionScene, cameraXR ); - - } + depthSensing.render( renderer, cameraXR ); if ( onAnimationFrameCallback ) onAnimationFrameCallback( time, frame ); From 2a16af26695f7184c6e39a90573a2a4c2fc29a78 Mon Sep 17 00:00:00 2001 From: mrdoob Date: Tue, 30 Jan 2024 15:37:25 +0900 Subject: [PATCH 07/15] Update WebXRDepthSensing.js --- src/renderers/webxr/WebXRDepthSensing.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/renderers/webxr/WebXRDepthSensing.js b/src/renderers/webxr/WebXRDepthSensing.js index b15fef955c22b6..d5a40c77ff6043 100644 --- a/src/renderers/webxr/WebXRDepthSensing.js +++ b/src/renderers/webxr/WebXRDepthSensing.js @@ -1,7 +1,6 @@ import { PlaneGeometry } from '../../geometries/PlaneGeometry.js'; import { ShaderMaterial } from '../../materials/ShaderMaterial.js'; import { Mesh } from '../../objects/Mesh.js'; -import { Scene } from '../../scenes/Scene.js'; import { Texture } from '../../textures/Texture.js'; const _occlusion_vertex = ` From 3706f2f0cb1ca5923739f901f2e307df99d76c5c Mon Sep 17 00:00:00 2001 From: mrdoob Date: Tue, 30 Jan 2024 15:44:19 +0900 Subject: [PATCH 08/15] Update WebXRManager.js --- src/renderers/webxr/WebXRManager.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/renderers/webxr/WebXRManager.js b/src/renderers/webxr/WebXRManager.js index 86ceacb185a808..1c0becf0a6c502 100644 --- a/src/renderers/webxr/WebXRManager.js +++ b/src/renderers/webxr/WebXRManager.js @@ -36,7 +36,7 @@ class WebXRManager extends EventDispatcher { let glBaseLayer = null; let xrFrame = null; - const depthSensing = new WebXRDepthSensing( renderer ); + const depthSensing = new WebXRDepthSensing(); const attributes = gl.getContextAttributes(); let initialRenderTarget = null; From fc048cddf65e4b9a6cfc7d93b2d3c51ba4917b0d Mon Sep 17 00:00:00 2001 From: mrdoob Date: Tue, 30 Jan 2024 19:27:44 +0900 Subject: [PATCH 09/15] Update WebXRDepthSensing.js --- src/renderers/webxr/WebXRDepthSensing.js | 19 ++++++++++--------- 1 file changed, 10 insertions(+), 9 deletions(-) diff --git a/src/renderers/webxr/WebXRDepthSensing.js b/src/renderers/webxr/WebXRDepthSensing.js index d5a40c77ff6043..81471b1108db28 100644 --- a/src/renderers/webxr/WebXRDepthSensing.js +++ b/src/renderers/webxr/WebXRDepthSensing.js @@ -6,7 +6,7 @@ import { Texture } from '../../textures/Texture.js'; const _occlusion_vertex = ` void main() { - gl_Position = vec4(position, 1.0); + gl_Position = vec4( position, 1.0 ); }`; @@ -17,16 +17,17 @@ uniform float depthHeight; void main() { - int arrayIndex = 0; - vec2 depthUv; - if (gl_FragCoord.x>=depthWidth) { - arrayIndex = 1; - depthUv = vec2((gl_FragCoord.x-depthWidth)/depthWidth, gl_FragCoord.y/depthHeight); + vec2 coord = vec2( gl_FragCoord.x / depthWidth, gl_FragCoord.y / depthHeight ); + + if ( coord.x >= 1.0 ) { + + gl_FragDepthEXT = texture( depthColor, vec3( coord.x - 1.0, coord.y, 1 ) ).r; + } else { - depthUv = vec2(gl_FragCoord.x/depthWidth, gl_FragCoord.y/depthHeight); - } - gl_FragDepthEXT = texture(depthColor, vec3(depthUv.x, depthUv.y, arrayIndex)).r; + gl_FragDepthEXT = texture( depthColor, vec3( coord.x, coord.y, 0 ) ).r; + + } }`; From ce1189c85c9dbf1d6cc6b75f4b1466a13f07cb1a Mon Sep 17 00:00:00 2001 From: mrdoob Date: Tue, 30 Jan 2024 19:34:26 +0900 Subject: [PATCH 10/15] Update WebXRDepthSensing.js --- src/renderers/webxr/WebXRDepthSensing.js | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/src/renderers/webxr/WebXRDepthSensing.js b/src/renderers/webxr/WebXRDepthSensing.js index 81471b1108db28..4008370dad8b47 100644 --- a/src/renderers/webxr/WebXRDepthSensing.js +++ b/src/renderers/webxr/WebXRDepthSensing.js @@ -72,7 +72,8 @@ class WebXRDepthSensing { if ( this.mesh === null ) { const viewport = cameraXR.cameras[ 0 ].viewport; - const occlusionMaterial = new ShaderMaterial( { + const material = new ShaderMaterial( { + extensions: { fragDepth: true }, vertexShader: _occlusion_vertex, fragmentShader: _occlusion_fragment, uniforms: { @@ -82,9 +83,7 @@ class WebXRDepthSensing { } } ); - occlusionMaterial.extensions.fragDepth = true; - - this.mesh = new Mesh( new PlaneGeometry( 20, 20 ), occlusionMaterial ); + this.mesh = new Mesh( new PlaneGeometry( 20, 20 ), material ); } From 06eed988c47aea81a5d7a4335f162a4a8731362e Mon Sep 17 00:00:00 2001 From: mrdoob Date: Tue, 30 Jan 2024 19:42:33 +0900 Subject: [PATCH 11/15] Update WebXRDepthSensing.js --- src/renderers/webxr/WebXRDepthSensing.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/renderers/webxr/WebXRDepthSensing.js b/src/renderers/webxr/WebXRDepthSensing.js index 4008370dad8b47..6deb02eed5fec4 100644 --- a/src/renderers/webxr/WebXRDepthSensing.js +++ b/src/renderers/webxr/WebXRDepthSensing.js @@ -43,7 +43,7 @@ class WebXRDepthSensing { } - init( renderer, session, depthData ) { + init( renderer, depthData, renderState ) { if ( this.texture === null ) { @@ -52,7 +52,7 @@ class WebXRDepthSensing { const texProps = renderer.properties.get( texture ); texProps.__webglTexture = depthData.texture; - if ( ( depthData.depthNear != session.renderState.depthNear ) || ( depthData.depthFar != session.renderState.depthFar ) ) { + if ( ( depthData.depthNear != renderState.depthNear ) || ( depthData.depthFar != renderState.depthFar ) ) { this.depthNear = depthData.depthNear; this.depthFar = depthData.depthFar; From 1c82960f9b6bc9a928ea4be4eed752882904ce25 Mon Sep 17 00:00:00 2001 From: mrdoob Date: Tue, 30 Jan 2024 19:43:16 +0900 Subject: [PATCH 12/15] Update WebXRManager.js --- src/renderers/webxr/WebXRManager.js | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/renderers/webxr/WebXRManager.js b/src/renderers/webxr/WebXRManager.js index 1c0becf0a6c502..a164cee85a5db1 100644 --- a/src/renderers/webxr/WebXRManager.js +++ b/src/renderers/webxr/WebXRManager.js @@ -760,13 +760,15 @@ class WebXRManager extends EventDispatcher { // - if ( session.enabledFeatures && session.enabledFeatures.includes( 'depth-sensing' ) ) { + const enabledFeatures = session.enabledFeatures; + + if ( enabledFeatures && enabledFeatures.includes( 'depth-sensing' ) ) { const depthData = glBinding.getDepthInformation( views[ 0 ] ); if ( depthData && depthData.isValid && depthData.texture ) { - depthSensing.init( renderer, session, depthData ); + depthSensing.init( renderer, depthData, session.renderState ); } From 92e3e9b0c586c4fff7898c0a48fb665d35ea57d5 Mon Sep 17 00:00:00 2001 From: Rik Cabanier Date: Tue, 30 Jan 2024 18:28:37 +0000 Subject: [PATCH 13/15] pass correct depth/far clip in non-occlusion cases --- src/renderers/webxr/WebXRManager.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/renderers/webxr/WebXRManager.js b/src/renderers/webxr/WebXRManager.js index a164cee85a5db1..1896cb8ba1fc3a 100644 --- a/src/renderers/webxr/WebXRManager.js +++ b/src/renderers/webxr/WebXRManager.js @@ -550,10 +550,10 @@ class WebXRManager extends EventDispatcher { _currentDepthNear = cameraXR.near; _currentDepthFar = cameraXR.far; - cameraL.near = depthSensing.depthNear; // ? - cameraL.far = depthSensing.depthFar; // ? - cameraR.near = depthSensing.depthNear; // ? - cameraR.far = depthSensing.depthFar; // ? + cameraL.near = _currentDepthNear; + cameraL.far = _currentDepthFar; + cameraR.near = _currentDepthNear; + cameraR.far = _currentDepthFar; cameraL.updateProjectionMatrix(); cameraR.updateProjectionMatrix(); From b7810e000b8e5353a42d584928c070f1de6337af Mon Sep 17 00:00:00 2001 From: mrdoob Date: Wed, 31 Jan 2024 15:35:32 +0900 Subject: [PATCH 14/15] Update WebGLRenderer.js --- src/renderers/WebGLRenderer.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/renderers/WebGLRenderer.js b/src/renderers/WebGLRenderer.js index 3c6b25b1272b0a..aae548d8df6e46 100644 --- a/src/renderers/WebGLRenderer.js +++ b/src/renderers/WebGLRenderer.js @@ -1209,7 +1209,7 @@ class WebGLRenderer { // - if ( xr.enabled === false || xr.isPresenting === false || xr.hasOcclusion() === false ) { + if ( xr.enabled === false || xr.isPresenting === false || xr.hasDepthSensing() === false ) { background.render( currentRenderList, scene ); From 3cb683385533003a04ccd16c25b59009d7863293 Mon Sep 17 00:00:00 2001 From: mrdoob Date: Wed, 31 Jan 2024 15:36:16 +0900 Subject: [PATCH 15/15] Update WebXRManager.js --- src/renderers/webxr/WebXRManager.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/renderers/webxr/WebXRManager.js b/src/renderers/webxr/WebXRManager.js index 1896cb8ba1fc3a..fa9a5738c68302 100644 --- a/src/renderers/webxr/WebXRManager.js +++ b/src/renderers/webxr/WebXRManager.js @@ -660,7 +660,7 @@ class WebXRManager extends EventDispatcher { }; - this.hasOcclusion = function ( ) { + this.hasDepthSensing = function () { return depthSensing.texture !== null;