I'm Gabriele and I'm new in three.js world, I have an issue with a code, my orbitcontrols were works good, but when I added the composer to make the scene blurred they stopped working... Google's Console (in the browser) don't show me any error, so I don't know what happening to the code. I declared every js that I used in the code.
Somebody can help me please?
controls = new THREE.OrbitControls(camera, renderer.domElement);
controls.dispose();
controls.update();
controls.reset();
composer = new THREE.EffectComposer(renderer);
renderPass = new THREE.RenderPass(scene, camera);
composer.addPass(renderPass);
horizontalBlur = new THREE.ShaderPass({
...THREE.HorizontalBlurShader,
uniforms: {
...THREE.HorizontalBlurShader.uniforms,
h: {value: 1.0 / window.innerWidth * window.devicePixelRatio},
},
})
composer.addPass(horizontalBlur)
verticalBlur = new THREE.ShaderPass({
...THREE.VerticalBlurShader,
uniforms: {
...THREE.VerticalBlurShader.uniforms,
v: {value: 1.0 / window.innerHeight * window.devicePixelRatio },
},
})
composer.addPass(verticalBlur)
}
controls.dispose();
controls.update();
controls.reset();
There is no need to call these methods. Especially calling dispose() is problematic since this method will remove all event listeners of OrbitControls. Just do this and try again:
controls = new THREE.OrbitControls(camera, renderer.domElement);
In general, the usage of EffectComposer should not affect controls in any form.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With