How can I add video stream from my camera to the scene as background?
You can make your THREE.JS canvas transparent and put an HTML video behind it.
Here’s an article about how to put a video stream into an HTML video tag.
https://medium.com/canal-tech/how-video-streaming-works-on-the-web-an-introduction-7919739f7e1
1 Like
HTML5 video can also be used as a texture. In three.js, there is a VideoTexture class for this purpose. Check out https://eliashasle.github.io/ghost_webcam.html for an example, which also shades the video. (You should turn the audio volume down before entering the page.) You don’t have to do any custom shading, of course.
Once you have the texture, you can set it as scene.background: https://threejs.org/docs/#api/en/scenes/Scene.background
1 Like
Do you mean by passing the alpha: true opiton to WebGLRenderer function alongside with the canvas option.
Is there a difference to that than the way @LisaWy has described. Or are they two different implementations? If so is one is preferable to the other for any reason like performance etc.?
They are different solutions.
You tell us. 