How to make the result of the IFCLoader look better?

Hi all, IFCLoader devs here.

As you may know, in addition to the Three.js IFCLoader, we have published a repository with many functionalities to create BIM (architecture, engineering and construction) applications from scratch.

One thing I heard recently is that the Autodesk Forge viewer is also made with Three.js. Although we are slowly getting closer to having the same functionalities, one current difference is that their viewer has a smoother look and feel.

I wanted to ask you if you know how they have been able to achieve this effect (postprocessing effects? custom shaders?).

We have done a quick experiment with SSAOPass, although we don’t know if this is the right direction or if we will never be able to achieve an effect like the one in the image above. Any help or reference would be welcome.

Thanks in advance!

      this.composer = new EffectComposer(this.renderer);
      const ssaoPass = new SSAOPass(scene, camera, dims.width, dims.height);
      ssaoPass.kernelRadius = 1;
      ssaoPass.minDistance = 0.001;
      ssaoPass.maxDistance = 0.3;
      this.composer.addPass(ssaoPass);

1 Like

Can you please test if you get better AO results by doing this:

ssaoPass.normalRenderTarget.depthTexture.type = THREE.FloatType;

This will ensure a higher precision of the depth texture. However, this only works reliably on devices with WebGL 2 support.

2 Likes

Check out Vanruesc’s postprocessing package – it contains quite a few optimizations, improvements, and effects over some of the post processing capabilities in the examples folders:

2 Likes

Thank you! Indeed, what @Mugen87 suggested greatly improved the result. However, this library has a lot of work into it and it is exactly what we needed. Thank you both!

1 Like