Hello!
This problem has been posted by others before, but not resolved from what I can see. I have a program that runs fine, but the moment that I include post processing effects like Composer and BloomPass all I get is a solid white screen for output. No, this is not because the light is set too high, I’ve set my light intensity about as low as I can. This is also not because the computers I have cannot handle the effects.
Example: this React version will likely initially load as white output, but then auto-loads the required dependencies that will then properly display the exact bloom effects I’m looking for. https://codesandbox.io/p/sandbox/bloom-hdr-workflow-gnn4yt?file=%2Fsrc%2Findex.js I can interact with the shapes and you’ll be able to do the same and see the bloompass effect.
This is what I am trying to get into my version, but no matter what adjustments I make I cannot get it to work.
What I want to do is reference these dependencies in my HTML file:
<script src="https://cdn.jsdelivr.net/npm/three/examples/jsm/postprocessing/RenderPass.js"></script>
<script src="https://cdn.jsdelivr.net/npm/three/examples/jsm/postprocessing/UnrealBloomPass.js"></script>
and to implement the js portion I tried adding this:
const composer = new THREE.EffectComposer(renderer);
const renderPass = new THREE.RenderPass(scene, camera);
composer.addPass(renderPass);
const bloomPass = new THREE.UnrealBloomPass(
new THREE.Vector2(window.innerWidth, window.innerHeight),
0.2, // Strength of the bloom
0.2, // Radius
0.35 // Threshold
);
composer.addPass(bloomPass);
By all accounts this should work, but as mentioned, all I get is a white screen. Per the React Three example that I provided, that clearly works, and I think the same applies to my code. The issue seems to be that I cannot get the dependencies that I need. I don’t know, maybe that’s wrong, but all I know is my code works fine otherwise. It’s when I try to add bloom effects that everything goes white. How can I get these effects to work on individual light sources that I add?