From f33faf8475b0eb2fa87c8c0cab27c5bdfd1f434b Mon Sep 17 00:00:00 2001 From: AlexandruPopovici Date: Thu, 20 Oct 2022 15:07:13 +0300 Subject: [PATCH 1/2] Trying 24 bit encoding --- .../modules/materials/shaders/speckle-depth-frag.ts | 10 +++++++++- .../shaders/speckle-static-ao-generate-frag.ts | 13 +++++++------ 2 files changed, 16 insertions(+), 7 deletions(-) diff --git a/packages/viewer/src/modules/materials/shaders/speckle-depth-frag.ts b/packages/viewer/src/modules/materials/shaders/speckle-depth-frag.ts index 756a24030..bd230e37e 100644 --- a/packages/viewer/src/modules/materials/shaders/speckle-depth-frag.ts +++ b/packages/viewer/src/modules/materials/shaders/speckle-depth-frag.ts @@ -25,6 +25,14 @@ vec3 packLinearDepth(const in float depth) { return pack; } +vec3 encode24(const in float x) { + const vec3 code = vec3(1.0, 255.0, 65025.0); + vec3 pack = vec3(code * x); + pack.gb = fract(pack.gb); + pack.rg -= pack.gb * (1.0 / 256.0); + return pack; +} + void main() { #include vec4 diffuseColor = vec4( 1.0 ); @@ -45,7 +53,7 @@ void main() { // Higher precision equivalent of gl_FragCoord.z. This assumes depthRange has been left to its default values. #ifdef LINEAR_DEPTH /** View z is negative moving away from the camera */ - gl_FragColor = packDepthToRGBA((vViewPosition.z + near) / (near - far)); + gl_FragColor = vec4(encode24((vViewPosition.z + near) / (near - far)), 1.); #else float fragCoordZ = (0.5 * vHighPrecisionZW[0] / vHighPrecisionZW[1] + 0.5); #if DEPTH_PACKING == 3200 diff --git a/packages/viewer/src/modules/materials/shaders/speckle-static-ao-generate-frag.ts b/packages/viewer/src/modules/materials/shaders/speckle-static-ao-generate-frag.ts index b7724264d..8c5f4b678 100644 --- a/packages/viewer/src/modules/materials/shaders/speckle-static-ao-generate-frag.ts +++ b/packages/viewer/src/modules/materials/shaders/speckle-static-ao-generate-frag.ts @@ -39,10 +39,6 @@ export const speckleStaticAoGenerateFrag = /* glsl */ ` return vec4( 1.0 ); } - float decode24(const in vec3 x) { - const vec3 decode = 1.0 / vec3(1.0, 255.0, 65025.0); - return dot(x, decode); - } float getDepth( const in vec2 screenPosition ) { return texture2D( tDepth, screenPosition ).y;//unpackRGBAToDepth( texture2D( tDepth, screenPosition ) ); @@ -207,6 +203,11 @@ export const speckleStaticAoGenerateFrag = /* glsl */ ` return Result; } + float decode24(const in vec3 x) { + const vec3 decode = 1.0 / vec3(1.0, 255.0, 65025.0); + return dot(x, decode); + } + float scaleDividedByCameraFar; float minResolutionMultipliedByCameraFar; @@ -273,7 +274,7 @@ export const speckleStaticAoGenerateFrag = /* glsl */ ` vec4 samplePointNDC = cameraProjectionMatrix * vec4( samplePoint, 1.0 ); // project point and calculate NDC samplePointNDC /= samplePointNDC.w; vec2 samplePointUv = samplePointNDC.xy * 0.5 + 0.5; // compute uv coordinates - float realDepth = unpackRGBAToDepth( texture2D( tDepth, samplePointUv ) );//getLinearDepth( samplePointUv ); // get linear depth from depth texture + float realDepth = decode24( texture2D( tDepth, samplePointUv ).rgb );//getLinearDepth( samplePointUv ); // get linear depth from depth texture // float realDepth = getLinearDepth( samplePointUv ); // get linear depth from depth texture float sampleDepth = viewZToOrthographicDepth( samplePoint.z, cameraNear, cameraFar ); // compute linear depth of the sample view Z value float delta = sampleDepth - realDepth; @@ -285,7 +286,7 @@ export const speckleStaticAoGenerateFrag = /* glsl */ ` #endif } void main() { - float linearDepth = unpackRGBAToDepth( texture2D( tDepth, vUv ) ); + float linearDepth = decode24( texture2D( tDepth, vUv ).rgb ); // float convertedViewZ = orthographicDepthToViewZ(linearDepth, cameraNear, cameraFar); // float centerDepth = viewZToPerspectiveDepth(convertedViewZ, cameraNear, cameraFar); float centerDepth = getPerspectiveDepth(vUv); From 72f3850c9f893a220b92aa6c9f651f86380a777e Mon Sep 17 00:00:00 2001 From: Alex Date: Thu, 20 Oct 2022 22:23:12 +0300 Subject: [PATCH 2/2] Fix for the macOS artifacts using linear depth buffer and a bias value --- packages/viewer-sandbox/src/Sandbox.ts | 12 +++ packages/viewer-sandbox/src/main.ts | 4 +- .../materials/shaders/speckle-depth-frag.ts | 18 +--- .../speckle-static-ao-generate-frag.ts | 86 +++++-------------- .../viewer/src/modules/pipeline/Pipeline.ts | 12 ++- .../src/modules/pipeline/StaticAOPass.ts | 3 + 6 files changed, 46 insertions(+), 89 deletions(-) diff --git a/packages/viewer-sandbox/src/Sandbox.ts b/packages/viewer-sandbox/src/Sandbox.ts index 3f8f78c7b..de0a526ce 100644 --- a/packages/viewer-sandbox/src/Sandbox.ts +++ b/packages/viewer-sandbox/src/Sandbox.ts @@ -50,6 +50,7 @@ export default class Sandbox { intensity: 0.8, kernelRadius: 0.35, // World space kernelSize: 16, + bias: 0.01, minDistance: 0, maxDistance: 0.008 } @@ -528,6 +529,17 @@ export default class Sandbox { this.viewer.requestRender() }) + staticAoFolder + .addInput(Sandbox.pipelineParams.staticAoParams, 'bias', { + min: -1, + max: 1, + step: 0.0001 + }) + .on('change', () => { + this.viewer.getRenderer().pipelineOptions = Sandbox.pipelineParams + this.viewer.requestRender() + }) + staticAoFolder .addInput(Sandbox.pipelineParams.staticAoParams, 'kernelSize', { min: 1, diff --git a/packages/viewer-sandbox/src/main.ts b/packages/viewer-sandbox/src/main.ts index 005d3fddb..00a7cdb84 100644 --- a/packages/viewer-sandbox/src/main.ts +++ b/packages/viewer-sandbox/src/main.ts @@ -82,11 +82,11 @@ sandbox.makeFilteringUI() await sandbox.loadUrl( // 'https://speckle.xyz/streams/da9e320dad/commits/5388ef24b8?c=%5B-7.66134,10.82932,6.41935,-0.07739,-13.88552,1.8697,0,1%5D' // Revit sample house (good for bim-like stuff with many display meshes) - 'https://speckle.xyz/streams/da9e320dad/commits/5388ef24b8' + // 'https://speckle.xyz/streams/da9e320dad/commits/5388ef24b8' // 'Super' heavy revit shit // 'https://speckle.xyz/streams/e6f9156405/commits/0694d53bb5' // IFC building (good for a tree based structure) - // 'https://latest.speckle.dev/streams/92b620fb17/commits/2ebd336223' + 'https://latest.speckle.dev/streams/92b620fb17/commits/2ebd336223' // IFC story, a subtree of the above // 'https://latest.speckle.dev/streams/92b620fb17/objects/8247bbc53865b0e0cb5ee4e252e66216' // Small scale lines diff --git a/packages/viewer/src/modules/materials/shaders/speckle-depth-frag.ts b/packages/viewer/src/modules/materials/shaders/speckle-depth-frag.ts index bd230e37e..f3b144f99 100644 --- a/packages/viewer/src/modules/materials/shaders/speckle-depth-frag.ts +++ b/packages/viewer/src/modules/materials/shaders/speckle-depth-frag.ts @@ -17,22 +17,6 @@ export const speckleDepthFrag = /* glsl */ ` #include varying vec2 vHighPrecisionZW; -vec3 packLinearDepth(const in float depth) { - const vec3 code = vec3(1.0, 255.0, 65025.0); - vec3 pack = vec3(code * depth); - pack.gb = fract(pack.gb); - pack.rg -= pack.gb * (1.0 / 256.0); - return pack; -} - -vec3 encode24(const in float x) { - const vec3 code = vec3(1.0, 255.0, 65025.0); - vec3 pack = vec3(code * x); - pack.gb = fract(pack.gb); - pack.rg -= pack.gb * (1.0 / 256.0); - return pack; -} - void main() { #include vec4 diffuseColor = vec4( 1.0 ); @@ -53,7 +37,7 @@ void main() { // Higher precision equivalent of gl_FragCoord.z. This assumes depthRange has been left to its default values. #ifdef LINEAR_DEPTH /** View z is negative moving away from the camera */ - gl_FragColor = vec4(encode24((vViewPosition.z + near) / (near - far)), 1.); + gl_FragColor = packDepthToRGBA((vViewPosition.z + near) / (near - far)); #else float fragCoordZ = (0.5 * vHighPrecisionZW[0] / vHighPrecisionZW[1] + 0.5); #if DEPTH_PACKING == 3200 diff --git a/packages/viewer/src/modules/materials/shaders/speckle-static-ao-generate-frag.ts b/packages/viewer/src/modules/materials/shaders/speckle-static-ao-generate-frag.ts index 8c5f4b678..af9e0ffbc 100644 --- a/packages/viewer/src/modules/materials/shaders/speckle-static-ao-generate-frag.ts +++ b/packages/viewer/src/modules/materials/shaders/speckle-static-ao-generate-frag.ts @@ -29,9 +29,9 @@ export const speckleStaticAoGenerateFrag = /* glsl */ ` // #define NUM_FRAMES 16 - #define NORMAL_TEXTURE 1 + #define NORMAL_TEXTURE 0 #define IMPROVED_NORMAL_RECONSTRUCTION 0 - #define ACCURATE_NORMAL_RECONSTRUCTION 0 + #define ACCURATE_NORMAL_RECONSTRUCTION 1 // RGBA depth #include @@ -40,14 +40,14 @@ export const speckleStaticAoGenerateFrag = /* glsl */ ` } - float getDepth( const in vec2 screenPosition ) { - return texture2D( tDepth, screenPosition ).y;//unpackRGBAToDepth( texture2D( tDepth, screenPosition ) ); + float getLinearDepth( const in vec2 screenPosition ) { + return unpackRGBAToDepth( texture2D( tDepth, screenPosition ) ); } float getPerspectiveDepth(const in vec2 coords) { float linearDepth = unpackRGBAToDepth( texture2D( tDepth, coords ) ); - float convertedViewZ = orthographicDepthToViewZ(linearDepth, cameraNear, cameraFar); - float centerDepth = viewZToPerspectiveDepth(convertedViewZ, cameraNear, cameraFar); + float viewZ = orthographicDepthToViewZ(linearDepth, cameraNear, cameraFar); + float centerDepth = viewZToPerspectiveDepth(viewZ, cameraNear, cameraFar); return centerDepth; } @@ -55,16 +55,6 @@ export const speckleStaticAoGenerateFrag = /* glsl */ ` return orthographicDepthToViewZ(linearDepth, cameraNear, cameraFar); } - float getLinearDepth( const in vec2 screenPosition ) { - #if PERSPECTIVE_CAMERA == 1 - float fragCoordZ = getDepth(screenPosition); - float viewZ = perspectiveDepthToViewZ( fragCoordZ, cameraNear, cameraFar ); - return viewZToOrthographicDepth( viewZ, cameraNear, cameraFar ); - #else - return texture2D( tDepth, screenPosition ).x; - #endif - } - float getViewZ( const in float depth ) { #if PERSPECTIVE_CAMERA == 1 return perspectiveDepthToViewZ( depth, cameraNear, cameraFar ); @@ -87,21 +77,21 @@ export const speckleStaticAoGenerateFrag = /* glsl */ ` highp vec2 ddx = vec2(dd.x, 0.); highp vec2 ddy = vec2(0., dd.y); - float sampleDepth = getDepth( uv - ddy ); + float sampleDepth = getPerspectiveDepth( uv - ddy ); float sampleViewZ = getViewZ( sampleDepth ); highp vec3 top = getViewPosition( uv - ddy, sampleDepth, sampleViewZ ); - sampleDepth = getDepth( uv + ddy ); + sampleDepth = getPerspectiveDepth( uv + ddy ); sampleViewZ = getViewZ( sampleDepth ); highp vec3 bottom = getViewPosition( uv + ddy, sampleDepth, sampleViewZ ); highp vec3 center = origin; - sampleDepth = getDepth( uv - ddx ); + sampleDepth = getPerspectiveDepth( uv - ddx ); sampleViewZ = getViewZ( sampleDepth ); highp vec3 left = getViewPosition( uv - ddx, sampleDepth, sampleViewZ ); - sampleDepth = getDepth( uv + ddx ); + sampleDepth = getPerspectiveDepth( uv + ddx ); sampleViewZ = getViewZ( sampleDepth ); highp vec3 right = getViewPosition( uv + ddx, sampleDepth, sampleViewZ ); @@ -152,18 +142,18 @@ export const speckleStaticAoGenerateFrag = /* glsl */ ` // get depth values at 1 & 2 pixels offsets from current along the horizontal axis vec4 H = vec4( - getPerspectiveDepth(uv - ddx), - getPerspectiveDepth(uv + ddx), - getPerspectiveDepth(uv - 2. * ddx), - getPerspectiveDepth(uv + 2. * ddx) + getLinearDepth(uv - ddx), + getLinearDepth(uv + ddx), + getLinearDepth(uv - 2. * ddx), + getLinearDepth(uv + 2. * ddx) ); // get depth values at 1 & 2 pixels offsets from current along the vertical axis vec4 V = vec4( - getPerspectiveDepth(uv - ddy), - getPerspectiveDepth(uv + ddy), - getPerspectiveDepth(uv - 2. * ddy), - getPerspectiveDepth(uv + 2. * ddy) + getLinearDepth(uv - ddy), + getLinearDepth(uv + ddy), + getLinearDepth(uv - 2. * ddy), + getLinearDepth(uv + 2. * ddy) ); // current pixel's depth difference from slope of offset depth samples @@ -195,19 +185,6 @@ export const speckleStaticAoGenerateFrag = /* glsl */ ` #endif } - highp float decode32(highp vec4 rgba) { - highp float Sign = 1.0 - step(128.0,rgba[0])*2.0; - highp float Exponent = 2.0 * mod(rgba[0],128.0) + step(128.0,rgba[1]) - 127.0; - highp float Mantissa = mod(rgba[1],128.0)*65536.0 + rgba[2]*256.0 +rgba[3] + float(0x800000); - highp float Result = Sign * exp2(Exponent) * (Mantissa * exp2(-23.0 )); - return Result; - } - - float decode24(const in vec3 x) { - const vec3 decode = 1.0 / vec3(1.0, 255.0, 65025.0); - return dot(x, decode); - } - float scaleDividedByCameraFar; float minResolutionMultipliedByCameraFar; @@ -230,7 +207,7 @@ export const speckleStaticAoGenerateFrag = /* glsl */ ` vec2 radius = (kernelRadius / size) * pow( alpha, 1.1 ); vec2 sampleUv = vUv + vec2( cos( angle + frameIndex * offset ), sin( angle + frameIndex * offset ) ) * radius; - float sampleDepth = getDepth( sampleUv ); + float sampleDepth = getPerspectiveDepth( sampleUv ); if( sampleDepth >= ( 1.0 - EPSILON ) ) { continue; } @@ -274,9 +251,8 @@ export const speckleStaticAoGenerateFrag = /* glsl */ ` vec4 samplePointNDC = cameraProjectionMatrix * vec4( samplePoint, 1.0 ); // project point and calculate NDC samplePointNDC /= samplePointNDC.w; vec2 samplePointUv = samplePointNDC.xy * 0.5 + 0.5; // compute uv coordinates - float realDepth = decode24( texture2D( tDepth, samplePointUv ).rgb );//getLinearDepth( samplePointUv ); // get linear depth from depth texture - // float realDepth = getLinearDepth( samplePointUv ); // get linear depth from depth texture - float sampleDepth = viewZToOrthographicDepth( samplePoint.z, cameraNear, cameraFar ); // compute linear depth of the sample view Z value + float realDepth = unpackRGBAToDepth( texture2D( tDepth, samplePointUv ) );//getLinearDepth( samplePointUv ); // get linear depth from depth texture + float sampleDepth = viewZToOrthographicDepth( samplePoint.z + bias, cameraNear, cameraFar ); // compute linear depth of the sample view Z value float delta = sampleDepth - realDepth; if ( delta > minDistance && delta < maxDistance ) { // if fragment is before sample point, increase occlusion occlusion += 1.0; @@ -286,32 +262,16 @@ export const speckleStaticAoGenerateFrag = /* glsl */ ` #endif } void main() { - float linearDepth = decode24( texture2D( tDepth, vUv ).rgb ); - // float convertedViewZ = orthographicDepthToViewZ(linearDepth, cameraNear, cameraFar); - // float centerDepth = viewZToPerspectiveDepth(convertedViewZ, cameraNear, cameraFar); + float linearDepth = unpackRGBAToDepth( texture2D( tDepth, vUv ) ); float centerDepth = getPerspectiveDepth(vUv); if( centerDepth >= ( 1.0 - EPSILON ) ) { discard; } float centerViewZ = getViewDepth(linearDepth); vec3 viewPosition = getViewPosition( vUv, centerDepth, centerViewZ ); - vec3 viewNormal = getViewNormal(viewPosition, vUv, centerDepth); + vec3 viewNormal = getViewNormal(viewPosition, vUv, linearDepth); float ambientOcclusion = getAmbientOcclusion( viewPosition, centerDepth ); gl_FragColor = getDefaultColor( vUv ); gl_FragColor.xyz *= ambientOcclusion; gl_FragColor.a = 1.; - // gl_FragColor.xyz = vec3(linearDepth);//vec3(getDepth( vUv ));//vec3((viewPosition.z + cameraNear) / (cameraNear-cameraFar)); - - // float centerDepth = getDepth(vUv);//getDepth( vUv ); - // if( centerDepth >= ( 1.0 - EPSILON ) ) { - // discard; - // } - // float centerViewZ = getViewZ( centerDepth ); - // vec3 viewPosition = getViewPosition( vUv, centerDepth, centerViewZ ); - // vec3 viewNormal = getViewNormal(viewPosition, vUv, centerDepth); - // float ambientOcclusion = getAmbientOcclusion( viewPosition, centerDepth ); - // gl_FragColor = getDefaultColor( vUv ); - // gl_FragColor.xyz *= ambientOcclusion; - // gl_FragColor.a = 1.; - // // gl_FragColor.xyz = vec3(centerDepth);//vec3(getDepth( vUv ));//vec3((viewPosition.z + cameraNear) / (cameraNear-cameraFar)); }` diff --git a/packages/viewer/src/modules/pipeline/Pipeline.ts b/packages/viewer/src/modules/pipeline/Pipeline.ts index ed637f986..1e4100f9f 100644 --- a/packages/viewer/src/modules/pipeline/Pipeline.ts +++ b/packages/viewer/src/modules/pipeline/Pipeline.ts @@ -175,11 +175,10 @@ export class Pipeline { case PipelineOutputType.PROGRESSIVE_AO: pipeline.push(this.depthPass) - pipeline.push(this.normalsPass) + // pipeline.push(this.normalsPass) pipeline.push(this.dynamicAoPass) pipeline.push(this.staticAoPass) pipeline.push(this.copyOutputPass) - this.normalsPass.enabled this.copyOutputPass.setTexture('tDiffuse', this.staticAoPass.outputTexture) this.copyOutputPass.setOutputType(PipelineOutputType.COLOR) this.needsProgressive = true @@ -241,10 +240,9 @@ export class Pipeline { private getDefaultPipeline(): Array { this.renderPass.renderToScreen = true - this.normalsPass.enabled = true - // this._pipelineOptions.dynamicAoParams.normalsType === NormalsType.DEFAULT - // ? true - // : false + this.normalsPass.enabled = this._pipelineOptions.dynamicAoParams.normalsType === NormalsType.DEFAULT + ? true + : false this.dynamicAoPass.setOutputType( this._pipelineOptions.dynamicAoParams.blurEnabled ? DynamicAOOutputType.AO_BLURRED @@ -329,7 +327,7 @@ export class Pipeline { this.accumulationFrame = 0 this.depthPass.enabled = true - // this.normalsPass.enabled = false + this.normalsPass.enabled = false this.dynamicAoPass.enabled = false this.renderPass.enabled = true this.applySaoPass.enabled = true diff --git a/packages/viewer/src/modules/pipeline/StaticAOPass.ts b/packages/viewer/src/modules/pipeline/StaticAOPass.ts index 5248ef42c..71cd070f4 100644 --- a/packages/viewer/src/modules/pipeline/StaticAOPass.ts +++ b/packages/viewer/src/modules/pipeline/StaticAOPass.ts @@ -43,6 +43,7 @@ export interface StaticAoPassParams { intensity: number kernelRadius: number kernelSize: number + bias: number minDistance: number maxDistance: number } @@ -51,6 +52,7 @@ export const DefaultStaticAoPassParams = { intensity: 0.8, kernelRadius: 0.35, // World space kernelSize: 16, + bias: 0.01, minDistance: 0, maxDistance: 0.008 } @@ -190,6 +192,7 @@ export class StaticAOPass extends Pass implements SpeckleProgressivePass { this.aoMaterial.uniforms['intensity'].value = this.params.intensity this.aoMaterial.uniforms['kernelRadius'].value = this.params.kernelRadius + this.aoMaterial.uniforms['bias'].value = this.params.bias this.aoMaterial.uniforms['frameIndex'].value = this.frameIndex this.aoMaterial.uniforms['minDistance'].value = this.params.minDistance