jupyter-widgets / pythreejs

A Jupyter - Three.js bridge
https://pythreejs.readthedocs.io
Other
936 stars 186 forks source link

Render to texture #229

Open zalavariandris opened 5 years ago

zalavariandris commented 5 years ago

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!

vidartf commented 5 years ago

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 👍

zalavariandris commented 5 years ago

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

vidartf commented 5 years ago

From looking quickly over the relevant parts, these are the main steps I see:

vidartf commented 5 years ago

I'm guessing that the width, height and texture properties are the minimum needed properties for the WebGLRenderTarget class.