Anti aliasing filter effect to the camera

Questions
21

@Evgeni_Popov may have an idea of what’s going on :slight_smile:

22

Would you have the link to the PG?

23

Sure, it is the PG @Kesshi shared

Here’s the steps:

  1. open the inspector. The rendering will be altered because there isn’t the event on resize of the container, but you just have to move the camera to reset.
  2. on the inspector click on rendering pipeline > default
  3. you’ll find image processor already enabled, but I’m not sure it is working. Anyway, disable and re-enable it. The rendering will be altered again, move the camera to reset.
  4. now you can see the banding issue on the background
24

I just tried that but i can’t reproduce your issue on my side. I tried in chrome and firefox.

25

does look like it happens with rendering pipeline only. it might be related to the praa process in place in the playground here

26

Yup, testing with the default rendering pipeline PG: DefaultRenderingPipeline | Babylon.js Playground (babylonjs.com), I don’t see the banding there

27

I found a playground similar to my project and I added the TAA post process and the default pipeline.
Now you can see the issue as the demo starts (especially on the blue sphere and the clouds in the background).

I noticed that if you create the default pipeline after the TAA postprocess and pass postprocess the issue appear, but if you create the default pipeline before those pp the issue is not present.

28

I removed most of the anti aliasing code from your PG. Now only 1 line is left.

Disabling line 105 removes the banding.
Maybe the BabylonJs team can have a look here. I have no idea :slight_smile:

29

The default texture type when you create a post process is UNSIGNED_BYTE. In your case, you want to use HALF_FLOAT or FLOAT:

30

Yes, that’s it! Adding BABYLON.Constants.TEXTURETYPE_FLOAT as textureType parameter to the PostProcess and PassPostProcess methods the issue is gone.

Thank you! :slight_smile: