[{"data":1,"prerenderedAt":7},["ShallowReactive",2],{"example-markdown-content:zh:dagre-position-layout-runtime-controls":3},{"markdown":4,"isPaidExample":5,"isTruncated":5,"charLimit":6},"# 固定 relation-graph 场景中的 Dagre 运行时位置调优\n\n## 这个示例构建了什么\n\n这个示例构建了一个全屏、只读的 relation-graph 查看器。它会加载一份静态网络，让 relation-graph 完成节点渲染与尺寸测量，然后仅使用 Dagre 计算节点位置。最终视图保留了自定义节点卡片、带标签的正交连接线、浮动辅助窗口以及小地图，而不是切换到 Dagre 专用渲染器。\n\n用户可以在同一个图实例保持挂载的情况下，重新调整 Dagre 的 `ranker`、`nodesep` 和 `ranksep`。他们还可以拖动或最小化辅助窗口、打开共享画布设置、导出图片，并通过内嵌的小视图检查重新布局后的图。这个示例的重点是运行时重新布局循环，而不只是初始的 Dagre 接入。\n\n## 数据是如何组织的\n\n数据集以内联方式声明为一个 `RGJsonData` 对象，其中包含 `rootId: 'root'`、一个扁平的 `nodes` 数组以及一个扁平的 `lines` 数组。节点文本刻意保持通用，这样示例就能把重点放在布局行为上，而不是业务语义上。\n\n在自定义布",true,500,1782615392736]