How to sample the texture with "invertY=false" in WebGPU

Questions
,
1

I want to reuse some textures in the scene for my WebGPU shader which are imported from outside assets to avoid creating new textures.

Some textures were loaded with “invertY=false” and “vScale=-1”.

image
image1920×1085 58.7 KB

When I sampled those textures in my shader, I got the result pixel upside down. And I didn’t find anywhere to tell the shader how to sample the texture with invertY=false. The shader seems sampling the texture with “invertY=true” by default.

How can I do except reloading the same texture with “invertY=true” again.

2

The invertY option for Texture is working correctly.

If you look at this PG, you can see that the results are the same when invert Y is used.

What does not work is vScale = -1;. The reason this doesn’t work is because changing the vScale is something that is done at runtime by the shader, and the shader material you wrote isn’t handling it.

3

And here is the code modified to support vScale = -1 for the texture.
After getting the textureMatrix, we need to pass it to the shader as uniform

WebGPU invertY=false | Babylon.js Playground (babylonjs.com)

2 Likes
6

Thank you so much! This is what I want.
The texures are loaded not by me. So the invertY can be true or false. I cannot change it. The textureMatrix is the property that I can control.

1 Like