Question about `screen.position(position2d)` block in NME (Procedural texture mode)

Questions
1

In this demo: https://nme.babylonjs.com/#MXHRPH#2

It just simply output the texture, but source image is:

logo-babylonjs-social-twitter
logo-babylonjs-social-twitter513×512 5.78 KB

And output is:
nme.babylonjs.com_
nme.babylonjs.com_582×582 72.4 KB

According to NME procedural texture question - Questions - Babylon.js, I knew that’s because the screen.position(position2d) block is in [-1,1] range, just wonder why it isn’t [0,1], and I can’t find any explanation in Babylon’s document.

Any help would be much appreciated.

2

The range is [-1,1] because those are coordinates in NDC (Normalized Device Coordinates) space which is the space the coordinates must be after the vertex shader is applied to input vertices. The ProceduralTexture is creating two triangles with those vertex coordinates:

        vertices.push(1, 1);
        vertices.push(-1, 1);
        vertices.push(-1, -1);
        vertices.push(1, -1);

so the vertex shader has nothing to do to pass them to the fragment shader, it just set gl_Position = position.

1 Like
3

Understood, thank you very much for your explanation! Btw, can nme provide a quick transformer to let it go to [0,1]? I think in Procedural texture mode we will often use coordinates based on [0,1]. Now I have to convert its coordinates to [0,1] every time, that is, divide its value by 2 and add 0.5, like this: https://nme.babylonjs.com/#MXHRPH#3

4

You can have a look at the default shader for “Post Process”:

image
image1232×601 47.6 KB

The uv0 block transforms the [-1,1] range to [0,1].

1 Like
5

Yeah, Remap Block works very well, Thanks again!