性能模式测试-Tree
这个示例构建了 relation-graph 内置树布局在性能模式下的全屏压测场。它可按多种规模预设重新生成合成层级数据,保持自定义员工卡片节点和小地图启用,并允许在实时图上继续调整布局与连接器表现。
在性能模式下借助实时运行时控制对树形布局进行压力测试
这个示例构建了什么
这个示例构建的是一个全屏树形布局压力测试工作台,而不是面向具体业务的查看器。它会渲染一个合成层级结构,并配有自定义员工卡片风格节点、带彩色标签的连接线、一个悬浮控制窗口,以及右下角的迷你视图。
用户可以在六个数据集规模预设之间切换,重新调整树的方向和间距,实时修改连接线样式,改变画布的滚轮和拖拽行为,并导出图片。这个示例的重点在于:它在启用更丰富展示层的同时,使用 performanceMode 运行 relation-graph 内置的 tree 布局。
数据如何组织
数据起始于一个内联的 RGJsonData 种子对象,其中包含 rootId: 'a'、一个扁平的 nodes 数组,以及一个扁平的 lines 数组。这个种子本身已经形成一棵树,而 generateTestJsonData(testDataSize) 会先克隆它,再继续添加更多后代节点。
这里的预处理步骤很关键。对于每个 id 中包含 - 的节点,生成器都会继续追加更多子节点和边。当