pythreejs
pythreejs copied to clipboard
Render to texture
With threejs is actually pretty simple way to render to a texture instead of the canvas.
Basically all you have to do is provide a render target to the render function: renderer.render(scene, camera, renderTarget)
this ink explains it in more detail: https://gamedevelopment.tutsplus.com/tutorials/quick-tip-how-to-render-to-a-texture-in-threejs--cms-25686
Unfortunately this is missing from the pythreejs api. I was trying to mess around with the send function, to send a WebGLRenderTarget along with the camera and the scene, but it did help. I don't really know what the send function exactly does to be honest, buy I guess its able to send python objects to javascript. here is my attempt:
bufferTexture = WebGLRenderTarget(width=100, height=100)
content = {
"type": "render",
"scene": to_json(scene, None),
"camera": to_json(camera, None),
"renderTarget": to_json(bufferTexture, None)
}
renderer.send(content)
renderer.render(scene, camera)
display(bufferTexture)
Is there a simple way to make this working? I would really love to use this feature along with jupyter notebook. Thanks for yout help!
I don't think the logic for WebGLRenderTarget
is implemented fully. However, it would be a nice feature to have. I think it would work well with the event driven nature of widgets as well. Putting it on the TODO list 👍
seems like the config file unfortunately has no properties for WebGLRenderTarget at all. I am not sure how the autoconfig works, at least other classes have a todo attribute. I guess a lot is missing to include this feature, but I'm not sure. Do you have an idea where to start?
https://github.com/jupyter-widgets/pythreejs/blob/97753f479c56901743d53bd2836d8b0d5b08084b/js/scripts/three-class-config.js
From looking quickly over the relevant parts, these are the main steps I see:
- Specify the relevant properties of the WebGLRenderTarget class in the the three-class-config file.
- Modify the
render()
function of WebGLRenderer. On the python side it needs to take an optional target parameter. It also needs to handle this in theonCustomMessage
handler on the JS side.
I'm guessing that the width
, height
and texture
properties are the minimum needed properties for the WebGLRenderTarget class.