Multiple cameras

[fabian0702]

This Pull Request introduces the ability to use multiple cameras in one scene, as discussed in this discord Thread. This would allow to have multiple ui.scene elements which are showing the same scene, but from multiple perspectives at the same time.

[falkoschindler]

Hi @fabian0702, thanks for the pull request!
It's an interesting idea and I just started to dive into it. Unfortunately I could not get the demo running in isolation. Somehow the parent element cannot be found. Is this a timing issue?

[fabian0702]

@falkoschindler The issue you encountered, seems to be from the asyncronous creation of elements in nicegui, which sometimes leads to the creation of the child scene, before the parent is even created. A possible solution would be to initialize the scene and then later replace it when the parent is fully initialized.

[falkoschindler]

@fabian0702 Have you tried running the demo in isolation?

with ui.scene().classes('w-2/3 h-64') as scene:
    teapot = 'https://upload.wikimedia.org/wikipedia/commons/9/93/Utah_teapot_(solid).stl'
    scene.stl(teapot).scale(0.3)

with ui.row().classes('w-full'):
    with ui.scene(parent_scene=scene).classes('w-1/3 h-32') as child_scene_1:
        child_scene_1.move_camera(x=1, y=-3, z=5)
    with ui.scene(parent_scene=scene).classes('w-1/3 h-32') as child_scene_2:
        child_scene_2.move_camera(x=0, y=3, z=3)

It still doesn't render the child scenes. 😕

[fabian0702]

@falkoschindler The problem you encountered seems to be from an incompletely initialised app, where calls getElement failed and should now be handled by an additional condition in the wait function.

[falkoschindler]

Thanks @fabian0702, now it's working. 🙂

I just experimented with the following demo:

with ui.scene() as main_scene:
    main_scene.sphere()

child_scene = ui.scene(parent_scene=main_scene)

ui.button('Add sphere to main scene', on_click=lambda: main_scene.sphere().move(x=1))
ui.button('Add sphere to child scene', on_click=lambda: child_scene.sphere().move(y=1))
ui.button('Clear main scene', on_click=main_scene.clear)
ui.button('Clear child scene', on_click=child_scene.clear)

Caused by the way child and parent scene are connected, the behavior might be a bit unexpected: Even though all spheres are shown in all scenes, in Python they are only added to one of the UI elements. When clearing a scene, only its "own" objects disappear, while the mirrored objects from the other scene remain visible. This is only one quirk I could find, but there might be more.

I wonder if there could be a better architecture for implementing different views on the very same 3D scene. What would it take to create a new ui.scene_view element which is not a ui.scene and can't be used to interact with 3D objects, but gets a ui.scene as an argument and only implements what is necessary to create the view and move the camera? Would we need to duplicate a lot of boilerplate Three.js code?

[fabian0702]

@falkoschindler I see two ways to achieve the desired behaviour, either to couple the objects of all scenes, effectively linking all ui.scenes together, or to implement a new ui.scene_view as you mentioned, an attempt at this can be found here.

[falkoschindler]

@fabian0702 Sorry for keeping you waiting for two weeks now. Since this is a rather tricky feature which takes some focus to get right, I procrastinated quite a bit. Now I finally found the time to look into the new SceneView, copied the relevant code from the commit, adjusted it a little and played around with it: I really like the approach! We can probably reduce it even more, e.g. removing the text renderers, maybe even the click handler depending on how static we want the new view to be.

Would you like to go on and update the PR? Or create a new one from scratch? I would really appreciate either of it! 🙂

[fabian0702]

@falkoschindler Thanks for the feedback, I think creating a new PR would be better considering how many commits are behind this branch. It would also improve readability and overall structure.
Due to the above points, closing this PR with a link to the new one would be the best option in my opinion.

[falkoschindler]

Alright. I'll close this PR and add a link to the new one later. 👍🏻