About Babylon filer

I want to achieve the shockwaveFiler effect, just like pixi.js(http://pixijs.io/pixi-filters/tools/demo/)
What should I do in babylon ?

1 Like

nice i can help

1 Like

Ooh, underwater shader effect!

Maybe this tutorial helps?

It’s geared towards Unity, but I think you’d just be interested in how it simulates refraction by sampling the scene, then jittering the UV coordinates.

Looking at the Pixi.JS shader implementation, it seems like they’re doing something similar using a sinusoidal offset to set the UV coordinates in the fragment shader:

I want to affect all of object in scene, just like https://doc.babylonjs.com/how_to/how_to_use_postprocesses#custom-postprocesses
Can “custom-postprocesses” achieve the filter effect ?

Can “custom-postprocesses” achieve the filter effect ?

Yes,. If this is not solved by the time I get back home this morning I got you. This is a ezpz shader, it’s just distorting the sampling space.

Look at the examples I did the Thanos effect that is kinda similar in idea. You just need a noise to distort the image in the aesthetic you want. I’d use my underwater caustic noise that is pretty easy to look up and then use that as the distortion, or make a tiling caustic image and use a texture lookup distortion.

1 Like

Looking forward to your Thanos effect, however, I hope filter can affect all of object in scene, just like “custom-postprocesses” , thank you

https://doc.babylonjs.com/examples/

go to the examples and then go to Heatwave, sorry I thought it was “thanos” but that is in the code.

Ohh here we go:
https://www.babylonjs-playground.com/#TZJ0HQ#18

1 Like

WOW! This is awesome! According to your example, I can derive other filter effects. I think BabylonJS is more powerful than pixi.js.

1 Like

Awesome example @Pryme8!