How to use textures with multiple maps? (basic texture mapping question)

Hello,

I am sorry, my questions is very basic, but I am trying to understand how to use textures with multiple maps.

My downloaded texture package contains 5 files:
ao
diffuse
edge
height
normal.

I believe that ‘diffuse’ should be set as StandardMaterial.diffuseTexture and ‘normal’ should be set as StandardMaterial.bumpTexture. Correct me if I am wrong.

How to use the others?

The original texture package: download.

AO is Ambient Occlusion and is only supported by PBR material. So you will need to use a PBRMaterial instead of a StandardMaterial.

ao should go to ambientTexture, diffuse to albedoTexture, normal to bumpTexture. Babylon.js does not support height map textures and I don’t know what is a edge texture.

See Mastering PBR Materials | Babylon.js Documentation for more info on PBR materials.

Something is wrong. My brickwall is completely black in this case.

You should setup a repro in the Playground so that we can help more.

How to upload assets (images) to playground?

You can’t upload your own textures directly to the playground but you can reference external textures that are stored on dropbox, github etc

1 Like

Here is the problem: https://www.babylonjs-playground.com/#WLSDFW#1.
The wall is black.

PBR needs an environment with light information(Lines 13-14):
https://www.babylonjs-playground.com/#WLSDFW#2

You can play with metallic/roughness as well

1 Like

And while I am here.
If I try to apply the same material to the shorter wall, the texture shrinks. Of course, I can create new material with different uScale, vScale, etc. But is there a way to tile the boxes universally, using the same material? I want my bricks have the same size on all boxes with any size. Is it possible to do using the only one material?

https://www.babylonjs-playground.com/#WLSDFW#3

If you want to use the same material, you will need to update the texture coordinates of both walls instead of updating the uScale / vScale properties.