Using textureLod in ShaderMaterial

Questions
1

hi guys,

I am new in BabylonJS, and trying to build some PBR materials with special effects, for example “thin film iridescence” in BabylonJS. I am learning something about PBR-Material and building my own PBR-Shader. I built a basic PBR-Shader, and now I want to do something more with IBL(image based lighting) and hdr. For Specular IBL i need to use textureLod Function from openGL to load mipmap according to the roughness levels. I tried something, but i always get the error “ERROR: 0:51: ‘textureLod’ : no matching overloaded function found”.

hier is what i tried.

in HTML file i added :

var engine = new BABYLON.Engine(canvas, false);
engine.getCaps().textureLOD = true;

In fragment shader i added

#extension GL_EXT_shader_texture_lod : enable

and in fragment shader i tried to use textureLod like this:

vec3 prefilteredColor = texture2DLodEXT(equirectangularMap, R,  roughness * MAX_REFLECTION_LOD);

then i got the error…“ERROR: 0:51: ‘textureLod’ : no matching overloaded function found”

I found some examples about textureLod and BabylonJS in playground, but non of them works.

Do you have any idea about this topic?

thanks,

Sonja

2

Hey! and welcome

Can you repro the issue on the playground? I should be able to fix it then

3

Hi Deltakosh,

here is the link: https://www.babylonjs-playground.com/#A74XFM#3
It took me a little time to put everything in the playground, and i still could not put the dds file in the playground, which i want to textureLod.

thanks:smiley:
Sonja

4

hi use this
texture2DLodEXT

#extension GL_EXT_shader_texture_lod : enable
#extension GL_OES_standard_derivatives : enable

https://cyos.babylonjs.com/#K08QRA

5

Hi nasimiasl,

It works!
I think “#extension GL_OES_standard_derivatives : enable” is what missed. With these two extension lines, i can use textureLod here. And what i actually want to try is this one "gvec4 textureLod ( gsampler3D sampler, vec3 P, float lod); ". Now the first step textureLod function works!!

thanks a lot for the help!
Sonja

1 Like
6

Please share the final result with us!

1 Like
7

Hi Deltakosh,
here is the effect at first step i want to try, lod the dds reflectionMap according to the Roughness and MipMap.
https://www.babylonjs-playground.com/#2FDQT5#100

and now i need to find a way to creat the dds file like the intern example DDS file, after that try to put this in my PBR-ShaderMaterial.

^-^Sonja

8

This is really cool!! I bet you gonna love the new feature I’m working on:

9

oh!! This is actually what i need!!! I will keep going on with this topic and keep trying!

1 Like