applyDisplacementMap inverted uvScale

Questions
1

I can’t seem to invert the texture using uvScale. I’m sure it’s a simple answer:

plane2.applyDisplacementMap("/textures/worldHeightMap.jpg", 0,10,null,new BABYLON.Vector2(0,0),new BABYLON.Vector2(1,-1),true);

Here’s a playground:
[https://www.babylonjs-playground.com/#IKANKZ#1(https://www.babylonjs-playground.com/#IKANKZ#1)

2

Are you sure your PG matches your question?

There’s no applyDisplacementMap call nor any scaling in the PG, only a texture that is changed after 10s…

3

Totally screwed that up. I didn’t press save.

Here’s the updated playground:
https://www.babylonjs-playground.com/#IKANKZ#1

4

Do you want to achieve this?:
https://www.babylonjs-playground.com/#IKANKZ#3
or this?:
https://www.babylonjs-playground.com/#IKANKZ#7
or this? :smile:
https://www.babylonjs-playground.com/#IKANKZ#8

Sorry if I don’t got your question right :sweat_smile:

5

I think @Luan_Ngo wants to have the texture inverted in the u/v dimensions:

image
image1272×1052 1.17 MB

It’s not currently possible because there’s a Math.abs() in the code:

var u = ((Math.abs(uv.x * uvScale.x + uvOffset.x) * heightMapWidth) % heightMapWidth) | 0;
var v = ((Math.abs(uv.y * uvScale.y + uvOffset.y) * heightMapHeight) % heightMapHeight) | 0;

It is easy to change it as:

var u = (((uv.x * uvScale.x + uvOffset.x) * heightMapWidth) % heightMapWidth) | 0;
var v = (((uv.y * uvScale.y + uvOffset.y) * heightMapHeight) % heightMapHeight) | 0;

if (u < 0) { u = heightMapWidth + u; }
if (v < 0) { v = heightMapHeight + v; }

but that would be a breaking change, so I don’t know how it should be handled…

For the time being, I have overloaded the function in the PG so that you can do what you want:

https://www.babylonjs-playground.com/#IKANKZ#4

1 Like
6

@Evgeni_Popov could you check against this one please?

plane2.applyDisplacementMap("/textures/worldHeightMap.jpg", 0, 10, null, new BABYLON.Vector2(-1, 1), new BABYLON.Vector2(1, 1), true);

from my pg https://www.babylonjs-playground.com/#IKANKZ#8

It’s really late, but would that script not show the same behavoir? :sweat_smile:

1 Like
7

Oh, that’s it. Sorry, I thought the offset shifts it rather than flips it.

I was using the example of a diffusetexture:

groundTexture.diffuseTexture.uScale = -1

Thank you all!

8

Indeed, that does work with offset = -1 too and no need to update the code!