Question

I'm trying to make a website using three.js, now problem is I have no idea how to implement a camera flash into three.js, right now I have a cube rotating around, and I want after 4 seconds there to be a camera flash where I load another page, I have stateTime += delta time, plus a basic scene etc etc, so if there are any suggestions to how to create a camera flash effect in threejs then please feel free to answer!

Here is a preview of what I have so far. All that I want to add is a camera flash!

Was it helpful?

Solution

I misread your question at first, thought you wanted to have a camera flash when switching between different scenes instead of separate pages, however this fiddle might still be of use to you.

http://jsfiddle.net/T4BDM/1/

composer = new THREE.EffectComposer(renderer);

renderPass = new THREE.RenderPass(scenes[sceneIndex], camera);
composer.addPass(renderPass);

colorifyPass = new THREE.ShaderPass(THREE.ColorifyShader);
colorifyPass.uniforms["color"].value.setRGB(0, 0, 0);
composer.addPass(colorifyPass);

var copyPass = new THREE.ShaderPass(THREE.CopyShader);
copyPass.renderToScreen = true;
composer.addPass(copyPass);

// see fiddle itself for camera flash logic

Upon clicking the result page, it initiates a "camera flash" (using a modified version of the colorify shader and the standard EffectComposer found in the /examples/js/postprocessing folder of three.js) and cycles between two scenes: a red cube and a blue sphere.

You can use the same effect to simulate a camera flash, except then you need to have two pages and implement it on the second page only.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top