Render glsl using PIXI.js

[trishul1979]

Hi,

 

I have just started learning pixi.js and have a query.

 

I would like to play/run GLSL code within Pixi but unable to find any example code for this.

 

for e.g. I would like to run similar code

http://glslsandbox.com/e#28499.0

 

I did looked at few examples but did not understand how to include this

http://pixijs.github.io/examples/index.html?s=basics&f=custom-filter.js&title=Custom%20Filter

 

Many thanks for any help.

[xerver]

Which part is confusing for you? The example shows how to pass in a custom fragment shader and use that filter.

[trishul1979]

I do not want to create filter but display the animation how it is working here

http://glslsandbox.com/e#28499.0

 

I did tried updating the GLSL code in the following file but it displays black

http://pixijs.github.io/examples/_assets/basics/shader.frag

[xerver]

Create a filter, assign it to the "shader" property of a sprite. That is what you need to do, as for the shader itself it will not be a direct copy-paste. glslsandbox exposes some things to the shaders that pixi does not, and pixi exposes things that the sandbox does not. You will need to investigate how to get the values you need based on how they are being sent to the shaders on that site.