How can I move the position of a shader?

[Kayna]

I ported a shader from Shadertoy but I'm stuck on how to move it around (right now it's at the bottom-left), does anyone know how it could be done?

 

I tried with quad.position.set(X, Y); but seems like that only crops it, it doesn't move it... Is there a function like .set(X, Y) for shaders where you can declare a specific position and the shader is placed there?

Edited July 14, 2022 by Kayna

[ivan.popelyshev]

you have to use projectionMatrix and translationMatrix uniforms in shader, otherwise pixi transform tree wont affect it. https://pixijs.io/examples/#/mesh-and-shaders/shadertoy-mesh.js

[Kayna]

On 7/5/2022 at 8:55 AM, ivan.popelyshev said:

you have to use projectionMatrix and translationMatrix uniforms in shader, otherwise pixi transform tree wont affect it. https://pixijs.io/examples/#/mesh-and-shaders/shadertoy-mesh.js

I included the projectionMatrix & translationMatrix but seems like the shadertoy-mesh example isn't moving it from the center, but rather it crops/cuts it from the sides... here I'm doing the same thing:

But what if you want to place the shader in the top-right corner (or any corner)? Is there an example of that?

I also tried changing the values of gl_Position at the vertexSrc but that also doesn't move the shader, it just crops/cuts it

 

Edited July 14, 2022 by Kayna

[ivan.popelyshev]

On 7/6/2022 at 1:50 AM, Kayna said:

I included the projectionMatrix & translationMatrix but seems like the shadertoy-mesh example isn't moving it from the center, but rather it crops/cuts it from the sides... here I'm doing the same thing: https://www.pixiplayground.com/#/edit/Nj1q7mDQGdkOz7LxUsrfo

But what if you want to place the shader in the top-right corner (or any corner)? Is there an example of that?

I also tried changing the values of gl_Position at the vertexSrc but that also doesn't move the shader, it just crops/cuts it

 

vec2 p = -.5 + gl_FragCoord.xy / iResolution.xy;

        p.x *= iResolution.x/iResolution.y;

You have to use UV's here, normalized coords inside the mesh, not the "pixel coord" that webgl gives you. PixiJS cannot affect shader insides, sorry )

Further questions please relay to discord, because im not the one currently who is in charge of answering questions