使用插槽渲染徽章的自定义节点展开控件

本示例构建的内容

本示例构建了一个全高层级查看器，其主要教学重点并不是数据集本身，而是替换 relation-graph 默认的展开/折叠控件。图谱初始时以居中的矩形树形结构展示类似子系统的节点，使用锚定到边框的直线连线，并在每个可展开节点的右侧渲染一个粉色胶囊形控件。

用户可以查看层级结构，并通过这个自定义控件切换分支。其中一个分支会在初始化后立即折叠，因此自定义控件在折叠和展开两种状态下都会可见，而不是只在手动交互之后才出现。

数据如何组织

数据来自一个本地异步辅助函数，它返回一个包含 rootId、nodes 和 lines 的根 JSON 对象。节点记录仅包含简单的 id 和 text 字段，而连线记录则使用 from、to 和 text 描述父子关系，这使得该结构可以很容易替换为设备树、产品分解结构、子系统图或其他层级依赖数据。

在图谱加载之前，代码会执行一个很小的预处理步骤：遍历 lines，当某条关系记录尚未包含 id 时为其补上兜底 id。完成这一步标准化后，示