构建一个由调色板驱动的渐变线图编辑器

这个示例构建的内容

这个示例构建的是一个紧凑的图编辑器，而不是只读的关系视图。初始画布会显示一个小型、类似工作流的路由图，其中包含圆角图标节点、与节点主体分离的文本标签，以及颜色从源节点过渡到目标节点的曲线连线。

用户可以选择节点和连线、框选多个节点、从顶部中央的调色板拖拽图标模板来创建新节点、通过节点旁的工具栏创建新的出边、删除已选节点、删除已选连线、调整节点尺寸、在浮动设置面板中修改画布滚轮与拖拽行为，并将当前图导出为图片。最重要的一点是，这个示例在保留 relation-graph 编辑模型的同时，替换了节点和连线两者的可视化表现层。

数据是如何组织的

初始图数据在 MyGraph.tsx 中以内联的 RGJsonData 形式声明。每个节点存储 id、text、color，以及一个 data.myIcon 字段，节点插槽会使用这个字段来选择 Lucide 图标。每条连线只存储 id、from、to 和 text，因此图一开始采用的是一种简单、偏业务友好的数据形状。

在调用