Mix Material with normal map

I need to make a terrain with different materials blended together (sand, grass etc.) and I found this class that is almost what I want to achieve:

The only problem is that some of the materials I want to blend have a normal map, and this method doesn’t allow for it, it only uses diffuse textures.

There is a way to implement other types of maps in this material or should I use a different approach?

Hello! Currently the material only mixes the colors of the diffuse, so if you wanted to use a bump map, you’d have to extend the shader ( Babylon.js/mix.fragment.fx at 19e98d3a4c15b434740694b14f90c34b6b4294e3 · BabylonJS/Babylon.js (github.com) ) to support that. But I think it’s easier to use something like the NodeMaterial, like this example mixing between two diffuse/bump maps: Babylon.js Node Material Editor (babylonjs.com) :smiley:

1 Like

The NodeMaterial seems to be the right choice here. Using the exemple you linked I was able to recreate a material that use both diffuse and normal maps, but there are two more things I’m not sure how to achieve with the node editor:

  • changing the UV scale of some texture, like in this blender node:

I can only find the Mesh.uv node, wich doesn’t accept any kind of parameter.

  • and use some texture as emissive (controlling also the strength of it) with the pbr metallic roughness node.

I usually use a light with low intensity in the scene and adjust the level of light of specific material using an emissive texture, so it’ll be useful to do that with this material as well.

Is it possible to do all of this in the node material editor directly?

Yes, I remember that promise. :face_with_monocle: And I’m sure @Dad72 among others also remembers.
Just know that you’re seen :rofl: (no, this is not a warning :grin: Just a frendly reminder :stuck_out_tongue_winking_eye:

When you select the Texture node, you can change the UV scale in it:


Or you can also perform a multiplication/scale on the UVs directly:

Babylon.js Node Material Editor (babylonjs.com)