Question

Is it possible in three.js to create transparent/invisible plane, which can receive shadows? My aim is to draw some object on 3d canvas without background (so I can see webpage behind the canvas element). I want the object to cast shadows on the background and I thought, if I could make an invisble plane, then webpage background is still visible. Shadows are casted on the plane and it seems like shadows are on the webpage.
Right now I can make a white plane with opacity 0.5 (or similar), but this way the plane is visible. Ideally the plane should be completely invisble (except for shadows).

EDIT: I created an exampled (based on this): http://jsfiddle.net/s5YGu/2/

Here I have opacity 0.5, but you can see the plane. If I set opacity to 0, then the whole plane and the shadows disappear.

Answer 1

I made this work by hacking on basic shader, here is working shader code http://pastie.org/5088640

It has no drawbacks AFAIK, like opacity: 0.1