布局旋转角度控制
这个示例展示如何在运行时旋转已挂载的 relation-graph 布局,并在同一数据集上切换内置中心布局与树布局。悬浮工具窗提供角度控制、布局切换、画布行为设置和图片导出,使其成为小型布局调优工作区。
通过实时角度偏移旋转内置布局
本示例构建了什么
本示例构建了一个全视口的 relation graph 工作区,用于研究同一份固定数据集在运行时改变布局角度时会如何重新排布。主视图展示了一个带标签的小型图谱,其中包含圆形节点、沿路径挂载的边标签,以及悬浮在画布上方的控制窗口。
用户可以用滑块或步进按钮旋转当前布局,在内置 center 和 tree 布局之间切换同一张图,打开一个辅助设置面板,并将当前图谱导出为图片。最关键的一点是,这个示例不会为了每次比较而重新加载新的业务数据。它会在内存中保留同一张图,并在已挂载的实例上修改 layout.rotate 和 layout.layoutName。
数据如何组织
图数据在 initializeGraph() 内以内联方式声明为一个 RGJsonData 对象,其中包含 rootId: '2'、15 个已声明节点和 15 条已声明连线。在调用 setJsonData() 之前没有预处理步骤:示例对象会直接构建并加载。
这使得该数据结构很容易替换为真实应用数据,例如所有权图、汇报树、