This example turns relation-graph into a lightweight in-browser graph editor with toolbar-driven node and line creation, target-aware right-click deletion, relayout controls, and local save-and-restore. It also layers shared canvas settings and image export utilities over the same workspace, making it a compact reference for editable graph shells rather than a read-only viewer.

Building a Lightweight Graph Editor with Context Menu and Local Save

What This Example Builds

This example builds a full-screen graph editing workspace rather than a fixed viewer. Users can add nodes, create lines, delete selected objects, reapply layout, fit the viewport, and save the current graph state into browser local storage. A floating helper window stays available for instructions, canvas interaction settings, and image export.

The most useful part of the demo is how it combines