connectViewports Function

Forms a connection between two or more Viewports such that a change in any one of the viewports is reflected in all of the others.

When the connection is first formed, all of the viewports are synchronized to the current state of the first viewport in viewports. Thereafter, an event listener registered with each viewport's Viewport.onViewChanged event is invoked when anything about that viewport's state changes. Each time such an event occurs, the initating ("source") viewport is passed to sync to obtain a function that can be invoked to synchronize each of the other ("target") viewports with the source viewport's new state. The function returned by sync can choose to synchronize any or all aspects of the viewports' states, such as the viewed volume, display style, viewed categories or models, or anything else.

To sever the connection, invoke the function returned by this function. For example:

 // set up the connection.
 const disconnect = connectViewports([viewport0, viewport1, viewport2], (changedViewport) => synchronizeViewportFrusta(changedViewport));
 // some time later, sever the connection.
 disconnect();

connectViewports(viewports: Iterable<Viewport>, sync: (changedViewport: Viewport) => SynchronizeViewports): () => void

note Viewport.onViewChanged can be invoked very frequently - sometimes multiple times per frame. Try to avoid performing excessive computations within your synchronization functions.

see connectViewportFrusta to synchronize the Frustum of each viewport.

see connectViewportViews to synchronize every aspect of the viewports.

see TwoWayViewportSync to synchronize the state of exactly two viewports.

see Multiple Viewport Sample

extensions

Returns - () => void

a function that can be invoked to sever the connection between the viewports.

Defined in

• core/frontend/src/ViewportSync.ts Line 49

Last Updated: 20 June, 2023