Procedural texturing

Questions
1

@PirateJC I’m a little confused on the procedural texturing. If I’m wanting to drive things from a uvw perspective? Or use the xyz world vertex position for sampling a noise field? Where should I start?

2

Hello @unicomp21 , how are you doing?

I’m not sure if I fully understood you question. Procedural textures are just a handy way for you to create textures with specific procedurally generated data, usually to be used on a shader for a custom effect.

Babylon.js has lots of already prebuilt procedural textures:
Procedural Textures | Babylon.js Documentation (babylonjs.com)

For actually consuming the generated textures, procedural textures are no different from a standard texture, they can be used on materials as well as sampled directly.

Here is an example on using it in a custom Node Based Material:
Procedural Terrain Cube with a Noise Texture | Babylon.js Playground (babylonjs.com)

3

@srzerbetto I’m wanting to build my own procedural textures, using 3D noise(s). Make sense?

4

@unicomp21 , yes it does. You could use you own noise algorithm on de CPU, store the value data to a Uint8Array and than call RawTexture.CreateRGBTexture to create a Texture from it. The main issue would be that this can be much slower than using the provided Procedural Textures from Babylon.js since those are generated on the GPU.

You could also use the implementation we currently have for the Procedural textures as the bases for creating your own GPU based algorithm:

Babylon.js/packages/dev/proceduralTextures/src at master · BabylonJS/Babylon.js (github.com)

1 Like
5

Are there any examples w/ a uvw texture coordinate?

6

@sebavan @Evgeni_Popov any examples in mind?

7

I don’t think we have any examples of that.

I assume that when you say 3D noise, you mean a 3D texture of a noise? There are also analytical 3D noises, where you just call the function with a vec3 coordinate.

If you want to use a 3D texture as part of your shader to generate a procedural texture, you will have to create it on the CPU side (with createRawTexture3D) and pass it to your shader, just like any other texture type. On the shader side, you should declare it as a sampler3D instead of sampler2D.

8

@Evgeni_Popov do we support per vertex uvw ?

9

The default “uv” attribute is a vec2, but you can add any attribute you want, so adding a “uvw” attribute is very easy.

1 Like