Hi All,
I have added fxaa script in my project(added in camera component). But there is no effect on my scene objects (still exist jagged edges).
can you please guide me how to add post effects in my project?
Thanks in advance.
1 Like
I want to use FXAA for better resolution like sketchfab model viewer.
Also, I have tried with our in-build anti aliasing and fxaa script which is not meet my expectation.
Is there any alternate way to do this? (glsl available)
Is it possible that Sketchfab is using the native device pixel ratio so models look sharper on some displays?
Can you share me the details about to use fxaa via script?
For your reference:
https://imaginator.tatamotors.com/safari/
I am expecting this kind of quality.
It’s not FXAA alone here.
What you are doing now, attaching the FXAA to the camera is correct. My latter images are from enabling device pixel ratio as mentioned here: https://developer.playcanvas.com/en/user-manual/optimization/runtime-devicepixelratio/
An example of a PlayCanvas project with it enabled is here: https://playcanvas.com/project/446385/overview/starter-kit-model-viewer
Results will vary depending on the user’s display.
Looking at the canvas resolution, it looks like they are using the native device pixel ratio.
As a similar car example. Go to https://playcanv.as/e/p/RqJJ9oU9/?overlay=false
Open up devtools and paste in the console
pc.app.graphicsDevice.maxPixelRatio = 2
to enable device pixel ratio.
You can change it back to 1 to compare the difference.
On the attached car page, they do FXAA each frame, which should give them comparable result to when Playcanvas uses it, together with native pixel ratio.
But additionally when the camera stops moving, over a few frames they apply temporal anti-aliasing to smooth it even more. This in a way renders slightly (sub-pixel) shifted view, and they blend them together. You can see it when you look at the roof window, especially from front and back elevated angles. When you orbit the car around, you see the edges, but when you stop, over a second or two they get smoothed out.
2 Likes
How apply temporal anti-aliasing to smooth it?
Playcanvas does not have the implementation of it … so that’s something you’d need to investigate an implement. But you’d just need a very simple solution as mentioned if you want to apply it when camera is static - this would be a lot simpler than temporal AA for moving scenes. Basically just move camera tiny amount in the plane formed by left and up vectors, render the scene into render target and blend it on top of the backbuffer.