显示分支中的全部预加载节点
这个示例展示如何预加载多个企业关系分支、先隐藏大多数成员,再通过图内合成的 `Show More(...)` 节点一次性展开整条分支。它还演示了类型化节点插槽渲染、左到右正交树布局,以及用于交互调参和图片导出的共享悬浮设置面板。
通过图内 Show More 节点显示预加载的分支成员
这个示例构建了什么
这个示例围绕一家焦点公司构建了一个偏查看器风格的企业关系树。画布上会显示一个大型蓝色根卡片、四个用于投资和股东类别的类型化分支控制节点、每个分支下紧凑呈现的首批公司节点,以及当某个分支仍有隐藏成员时显示的蓝色 Show More(...) 芯片。
核心交互是在分支内部展开内容,而不是获取新数据。所有分支成员都会在启动时准备好,但其中大部分会保持隐藏,直到用户点击该分支中的合成显示节点。图上方的共享浮动窗口还提供帮助文本、设置面板和图片导出功能。
数据是如何组织的
图从一个内联的 RGJsonData 种子开始,其中包含一个根节点和四个分支节点。每个分支节点都带有类似 investment-button 或 shareholder-button 的 data.myType 值,初始的 lines 数组则将根节点连接到这四个类型化分类节点。
在图完整显示之前,appendTypeData 会调用本地的 loadMockCompanys(myType) 辅助