Synchronize renderWindow, addObserver on vtkRenderWindowInteractor in vtk.js

Hi,

I would like to synchronize 2 renderWindows (or more). Any mouse move from one will be apply to the others.

image

I have imagined to capture the camera from one renderWindow and then apply it to the other but I cannot trigger an event like EndMouseMove.
I have read this example (https://vtk.org/Wiki/VTK/Examples/Python/Interaction/MouseEventsObserver) that seems to be a solution but I cannot find the addObserver method on vtkRenderWindowInteractor in vtk.js.

Any idea or a simple vtk.js example to point me out ?

Ok I get it by using onMouseMove (and onMouseWheel) method from vtkRenderWindowInteractor to save a camera and then apply it to other renderers.

You can find a JSFiddle from https://jsfiddle.net/PBrockmann/5ae3tg6x/ that tests this approach.

image
It works nicelly. All 3 renderWindows are synchronized from any mouse and wheel move.
(the addObserver is not used finally)

Let me know if this could have been achieved a simpler way ?

You can also use the same camera instance across all your renderer.

I have tried to use the same camera but windows are not synchronized.
Please test it from https://jsfiddle.net/PBrockmann/07tnhL14/ if you mind.

The missing part is the call to render which can be automated.

camera.onModified(macro.chain(rw1.render, rw2.render, rw3.render);
1 Like

Ok thank you Sebastian for this simpler solution indeed.

The JSFiddle has been modified accordingly.
Available from https://jsfiddle.net/PBrockmann/07tnhL14/
I let it there for the record.

Regards

1 Like

You need to be careful with reusing the same camera in multiple views, as clipping range is stored in the camera object and the values are not the same, if the size of the render windows are not exactly the same or if they don’t show the exact same content.