bumpMap node for procedural textures in TSL

[gnansai]

Description

We can use procedural textures as bumpMap in Blender. Something similar would be very useful in TSL.

Thank you

Solution

Alternatives

As of now, This is the workaround for using the proceduarl textures as normaMap in TSL.

https://discourse.threejs.org/t/is-there-blender-like-bumpnode-in-tsl/86637/6

Additional context

No response

[Mugen87]

To clarify, the code that potentially should work is:

const noiseSampler = sample( ( uv ) => {

    return mx_noise_float( uv.mul( 10 ), 1, 0.5 );

}, uv() );

material.normalNode = bumpMap( noiseSampler );

Demo: https://jsfiddle.net/gbp4voq0/

But it seems this has no effect so far.

[sunag]

I would recommend using the rtt( node, with, height ) node to transform it into a texture. This way you also reuse the pixels already calculated.

const noise = mx_noise_float( uv().mul( 100 ), 1, 0.5 );
const noiseTexture = rtt( noise, 256, 256 );
material.normalNode = bumpMap( noiseTexture );

https://jsfiddle.net/vLzrunak/1/

We can put a fallback for convertToTexture() in bumpMap() as well.

[Mugen87]

We can put a fallback for convertToTexture() in bumpMap() as well.

Sounds good! 👍

[boytchev]

Would rtt be useful only for the case when the texture is generated once and at fixed scale?

The maps in TSL Textures are dynamic (you can zoom in without pixelation) and are inherently 3D (so they wrap nicely around round objects, and they keep pattern continuity across edges). Most likely there is no a nice way for bump maps to eliminate triple calculations in such cases.

[sunag]

Would rtt be useful only for the case when the texture is generated once and at fixed scale?

I also think by exception if it is used in post-processing.