不断变化的树形布局

演示根据数据变化或用户交互持续更新和重新组织的动态树形布局。

不断变化的树形布局

功能概述

此示例演示动态树形布局，该布局根据数据变化或用户交互持续更新和重新组织自身。

核心特性实现

动态树结构

当添加、删除或修改节点时，树会自动调整：

const graphOptions: RGOptions = {
    layout: {
        layoutName: 'tree',
        from: 'left',
        reLayoutWhenExpandedOrCollapsed: true
    }
};

自动布局更新

数据更改时触发布局更新：

graphInstance.addNodes([newNode]);
await graphInstance.doLayout();

创意使用场景

• 实时数据源：实时更新的组织架构图
• 增长网络：可视化扩展网络
• 动态工作流：随时间演变的流程
• 自适应结构：自动重新组织的层级结构
• 交互式树：用户可修改的树结构