This example turns relation-graph's right-click event into a compact editing workflow for adding nodes, starting new lines from existing nodes, and deleting targeted objects. It uses a view-layer menu overlay, coordinate conversion for canvas insertion, runtime graph mutation APIs, manual relayout, and shared canvas settings or image export utilities.

Context-menu Node and Line Editing in a Tree Graph

What This Example Builds

This example builds a small tree graph inside a full-screen white workspace and adds a custom right-click menu on top of it. Users can right-click empty canvas space to add a node, right-click an existing node to start a new connection, and right-click a node or line to delete that specific object. A floating helper window stays available for relayout, canvas settings, and image export.

The main point of the demo