gkjohnson / three-gpu-pathtracer

Path tracing renderer and utilities for three.js built on top of three-mesh-bvh.
https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/index.html
MIT License
1.26k stars 125 forks source link

Add support for black and white Bump Maps to compute normals #558

Open dongho-shin opened 3 months ago

dongho-shin commented 3 months ago

Always thanks you for maintain amazing library

I tried to add bumpMap support like three.js but I got half success(bumpMap Rendered in only two faces and other faces are black) of it do you guys have any ideas?

Untitled (28)

I use this bumpTexture

bump-mapping

PhysicalPathTracingMaterial's vertex shader i add vViewPosition

image image
// https://github.com/mrdoob/three.js/blob/dev/src/renderers/shaders/ShaderChunk/bumpmap_pars_fragment.glsl.js
    vec3 perturbNormalArb( vec3 surf_pos, vec3 surf_norm, vec2 dHdxy, float faceDirection ) {

        // normalize is done to ensure that the bump map looks the same regardless of the texture's scale
        vec3 vSigmaX = normalize( dFdx( surf_pos.xyz ) );
        vec3 vSigmaY = normalize( dFdy( surf_pos.xyz ) );
        vec3 vN = surf_norm; // normalized

        vec3 R1 = cross( vSigmaY, vN );
        vec3 R2 = cross( vN, vSigmaX );

        float fDet = dot( vSigmaX, R1 ) * faceDirection; //fDet is 0
        vec3 vGrad = sign( fDet ) * ( dHdxy.x * R1 + dHdxy.y * R2 );
        vec3 result = normalize( abs( fDet ) * surf_norm - vGrad );

        return result;

    }
                // getSurfaceRecord.glsl.js at line 164
        vec3 baseNormal = normal;
        if ( material.normalMap != - 1 ) {

            vec4 tangentSample = textureSampleBarycoord(
                attributesArray,
                ATTR_TANGENT,
                surfaceHit.barycoord,
                surfaceHit.faceIndices.xyz
            );

            // some provided tangents can be malformed (0, 0, 0) causing the normal to be degenerate
            // resulting in NaNs and slow path tracing.
            if ( length( tangentSample.xyz ) > 0.0 ) {

                vec3 tangent = normalize( tangentSample.xyz );
                vec3 bitangent = normalize( cross( normal, tangent ) * tangentSample.w );
                mat3 vTBN = mat3( tangent, bitangent, normal );

                vec3 uvPrime = material.normalMapTransform * vec3( uv, 1 );
                vec3 texNormal = texture2D( textures, vec3( uvPrime.xy, material.normalMap ) ).xyz * 2.0 - 1.0;
                texNormal.xy *= material.normalScale;
                normal = vTBN * texNormal;

            }

        } else if( material.bumpMap != -1) {

            vec3 uvPrime = material.bumpMapTransform * vec3( uv, 1 );
            float bumpScale = material.bumpScale;

            vec2 dSTdx = dFdx( uvPrime.xy );
            vec2 dSTdy = dFdy( uvPrime.xy );

            float Hll = bumpScale * texture2D( textures, vec3( uvPrime.xy, material.bumpMap ) ).x;
            float dBx = bumpScale * texture2D( textures, vec3( uvPrime.xy + dSTdx, material.bumpMap ) ).x - Hll;
            float dBy = bumpScale * texture2D( textures, vec3( uvPrime.xy + dSTdy, material.bumpMap ) ).x - Hll;

            vec2 dHdxy = vec2( dBx, dBy );

            normal = perturbNormalArb( - viewPosition, surfaceHit.faceNormal, dHdxy,  1.0 );

        }

Is it wrong to put normal sampled by barycentric coord into a function based on tangent space?

gkjohnson commented 3 months ago

Hello! this might be easier if you make a PR so I can see the code in context - but it would be nice to add support for bump maps.

But that aside we can't treat bump maps in exactly the same way that three.js does. the dFdx / dFdy functions will not work, for example, because they rely on the samples that neighboring pixels have made. Instead we'll need to sample sibling pixels to manually take the derivative and compute the resulting normal.

You'll also see that normal maps require tangents to define the surface normal frame rather than the view direction as three.js uses since that's not really a viable option for path tracing. We'll want to do the same thing for bump maps, as well.

dongho-shin commented 3 months ago

Thanks for reply! I'll open PR soon

dongho-shin commented 3 months ago

@gkjohnson https://github.com/gkjohnson/three-gpu-pathtracer/pull/559 I open pull request always respect and thanks to quick reply

dongho-shin commented 1 month ago

I tried to find a way to implement this issue but I can't find a way without baked normalMap from bumpMap rendererd at rasterized view I checked a blender, it seems to use the baked normalMap

gkjohnson commented 1 month ago

I can't find a way without baked normalMap from bumpMap rendererd at rasterized view

Yes I think generating a normal map is the easiest approach for now. Perhaps in the future bump maps can be added but they seem less common.