Glitch Pass working, but SSAO Pass & SMAA Pass - not.
Everything was is done according to the documentation.
See my codesandbox, Scenes.js, 185 line, function initPasses.
I used “create react app 18.2.0” for wrapper and added Effect Composer with SSAO Pass or SMAA Pass, but not have result.
Code
initRenderer() {
const renderer = new WebGLRenderer({
powerPreference: "high-performance",
antialias: false,
stencil: false,
depth: false,
alpha: false
});
this.renderer = renderer;
renderer.setSize(this.width, this.height);
renderer.setPixelRatio(window.devicePixelRatio);
renderer.setClearColor(this.backgroundColor.convertSRGBToLinear(), 1);
renderer.physicallyCorrectLights = true;
renderer.outputEncoding = sRGBEncoding;
renderer.info.autoReset = false;
renderer.shadowMap.type = PCFSoftShadowMap;
renderer.shadowMap.autoUpdate = true;
renderer.shadowMap.needsUpdate = false;
renderer.shadowMap.enabled = true;
renderer.toneMapping = ACESFilmicToneMapping;
}
initPasses() {
const composer = new EffectComposer(this.renderer)
this.composer = composer
const renderPass = new RenderPass(this.scene, this.camera)
composer.addPass(renderPass)
const ssaoPass = new SSAOPass(this.scene, this.camera, this.width, this.height)
ssaoPass.kernelRadius = 16
composer.addPass(ssaoPass)
const smaaPass = new SMAAPass(this.width * this.renderer.getPixelRatio(), this.height * this.renderer.getPixelRatio())
composer.addPass(smaaPass)
const glitchPass = new GlitchPass()
composer.addPass(glitchPass)
}
initRender() {
const renderScene = () => {
this.orbitControls.update();
this.composer.render();
this.camera.updateProjectionMatrix();
};
this.req = requestAnimationFrame(function render(time) {
requestAnimationFrame(render);
renderScene();
});
}
Zoomed screenshot
