Hello all! I’m working on making a Three.js library that draws scenes in a 3D display for a company I work for. I have this working for a WebGL Renderer, and the basic functionality is that it moves the camera and shifts the projection matrix to take renders of the same scene from multiple angles each frame. The render textures from this are then processed such that, when the screen is overlaid with a lenticular, you’re able to see different angles of the same scene in each eye and from different physical positions, which is related to the way the Nintendo 3DS works.
OK, now to my issue. If possible, I’d like to have this work for CSS3D Renderers as well, but I don’t know how to grab the render each time I shift the camera to enable the processing I do at the end. Without being able to grab each “view,” I can’t make this work. Is there any way to store the render to something like a render texture? Or is it impossible, as I’ve seen the case is for things like iframe, for security reasons?
Thanks!
The CSS3D renderer uses HTML elements, there is no texture output. How are the different-angle-frames displayed/processed? It fully depends on how you want to process the frames, as there is no pixel buffer. But you can dublicate or simply clone the scene.
We use a shader that scatters the pixel data to match the physical lenticular, such that each view is seen from a different angle. And so it sounds like that would likely be impossible, or at least impossible to do with this technique. For reference, this is what a scene will end up looking like on a screen without the lenticular overlay:
You can see that we’re displacing the pixels on a final texture.
And here’s what the scene looks like without this process of taking multiple views:
As for cloning the scene, I can’t quite imagine how I would then properly display them such that they would match the lenticular. Thanks for your answer!
I see, there is no way besides CSS shaders (probably only supported by webkit).
Why is a CSS3D renderer required?
I’ll look into CSS shaders a bit more, see if anything can be done with that.
I’m just trying to make it as flexible and useful as possible for developers, so the more renderers it can work for the better! But if it’s only possible with WebGL, that’ll do fine.
