带目标端点选择的选中节点连线创建

这个示例构建了什么

这个示例在一个小型预置图之上构建了一个紧凑的连线编排工作区。页面使用全高的点状画布、一个浮动辅助窗口，以及一个自定义的环绕节点工具栏；该工具栏只会在恰好有一个节点处于编辑状态时出现。

用户可以点击节点、结合修饰键调整选择、清除画布状态，并从所选节点上方、下方、左侧或右侧的方向按钮发起一条新的出边。这个示例的核心在于，这个流程不会在选择目标节点时结束：示例还挂载了 relation-graph 内置的连线覆盖层，使用户可以进一步选择新连线落在目标节点的哪个位置。

数据如何组织

图数据直接在 initializeGraph() 内以内联方式组装为一个 RGJsonData 对象，其中包含一个 rootId、一个扁平的 nodes 数组，以及一个扁平的 lines 数组。这个预置数据集规模小且写死在代码中，因此很容易替换为工作流步骤、服务、审批项或依赖项等业务实体。

在调用 setJsonData(...) 之前，没有额外的预处理步骤，只有在代码中构建这个 JSON 对象。组件挂载时的