GoJS alongside 3D (with Svelte)

Selected Node Information
X/Y
Y/Z
X/Z

This sample demonstrates GoJS Diagrams alongside a 3D model made with ThreeJS.

Three separate GoJS Diagrams observe a single model, each showing two of three coordinate planes. When Nodes are moved or resized, two-way bindings on the Node Templates transmit those changes back to the model, automatically updating the other GoJS Diagrams. The ThreeJS view is updated with a Model change listener (model.addChangedListener).

This sample also demonstrates GoJS alongside Svelte, where one component creates a GoJS model and passes it to children components. Those components bind the model and a selection variable, to pass upwards to update the state of other diagrams and the UI. A simple node information component is included to show details about a selected object.

The GoJS-3D project source code can be found here.

gojs.net - see all GoJS samples