2

i want to render a texture on the background and the 3dscene in the foreground. i used the effectcomposer to do this.

how ever my first pass (the background) seems to be "overwritten" with the 2nd pass (the scene) the result only the scene gets drawn with a black background. it looks like the background of the second pass isnt drawn transparent or the transparancy is lost.

http://jsfiddle.net/mdwzx1f8/8/

var renderTex = new THREE.TexturePass(myTex);
var renderScene = new THREE.RenderPass(scene, camera);

composer.addPass(renderTex);
composer.addPass(renderScene);

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

i hope someone can take a quick look at it and point me in the right direction

thanks in advance

Updates:

07/07/2015

08/07/2015

  • Found another interesting page https://github.com/mrdoob/three.js/issues/5979 not sure if this is related yet
  • Updated the fiddle if you comment line 53 you will see the 1st pass which should be visible if the scene background is drawn transparent
Raymond
  • 93
  • 7
  • This has been keeping me busy for a few days... anybody? :) – Raymond Jul 03 '15 at 11:37
  • if you look at the related things there are some that sound relevant, http://stackoverflow.com/questions/20899326/how-do-i-stop-effectcomposer-from-destroying-my-transparent-background?rq=1 & perhaps http://stackoverflow.com/questions/14505576/reset-depth-buffers-destroyed-by-effectcomposer?rq=1 – antont Jul 03 '15 at 13:23
  • tried clearing the depth buffer with renderer.clear(false, true, false); but no luck yet – Raymond Jul 06 '15 at 06:37

1 Answers1

1

Bobafett in the threejs irc channel helped me out and he found my issue, it turns out that i called: renderer.autoClear = false; instead onrenderer.autoClearColor = false;

Here is the modified and working fiddle: http://jsfiddle.net/mdwzx1f8/9/

I would like to thank all who have helped me in the search for the solution

Raymond
  • 93
  • 7