[Bug]: fund-flow 示例流程图问题，默认收拢的流程图无法点击+号在画布右侧展开

[windyfay]

Describe the bug / 问题描述

网站示例场景中的资金流向图，点击最后一层节点的+号时无法在画布右侧展开，会定位到root节点，后续一层无法展示

Reproduction link / 复现链接

https://g6.antv.antgroup.com/examples/scene-case/default/#fund-flow

Steps to Reproduce the Bug or Issue / 重现步骤

No response

Version / 版本

🆕 5.x

OS / 操作系统

• macOS
• Windows
• Linux
• Others / 其他

Browser / 浏览器

• Chrome
• Edge
• Firefox
• Safari (Limited support / 有限支持)
• IE (Nonsupport / 不支持)
• Others / 其他

[github-actions]

@windyfay 您好！以下是关于您问题的自动回复：

感谢您的反馈！针对您提出的 fund-flow 示例流程图在最后一层节点点击 + 号无法在画布右侧展开的问题，以下是分析和建议：

---

问题分析

1. 节点展开交互逻辑

G6 的节点展开功能通常通过 graph.expandElement(id, options) 方法实现。该方法支持动画和位置保持选项，理论上应能正常展开任何层级的节点。

2. 展开失败的可能原因

• 画布渲染未正确更新：展开后未及时调用 graph.draw() 或 graph.render()，导致新节点未显示在画布右侧。
• 布局配置问题：布局（如 tree、grid 等）未对新增节点位置合理计算，可能会导致节点被重定位（如回到 root 节点附近）。
• 节点数据未正确更新：展开操作后，节点数据未正确传递或渲染，导致下一层未显示。

3. 定位到 root 节点原因

• 布局算法没有为新展开的节点分配合适的空间，导致画布重绘时所有节点偏移回根节点。
• 部分布局（如 tree）在展开/收拢时会重新计算所有节点位置。如果未设置 position 或 align 参数，可能出现位置错乱。

---

建议解决方案

1. 检查数据更新流程
   确认点击 + 号后，实际触发了 graph.expandElement 并正确更新了节点数据。

2. 确保画布重绘
   展开节点后应调用 graph.draw() 或 graph.render()，确保新状态实时反映到画布上。

   await graph.expandElement(nodeId, { align: true });
   await graph.draw();

3. 优化布局设置
   如果使用 tree 或 grid 布局，可通过 layout 的 position/align 参数为新节点指定合理位置，避免节点回到 root 区域。

   layout: {
     type: 'grid',
     align: true, // 保持已展开节点相对位置不变
     // 或为特定节点指定位置
     position: (node) => node.id === 'expanded-node-id' ? { row: 2, col: 4 } : undefined,
   }

4. 事件处理优化
   使用事件委托监听节点的展开事件，确保每次点击 + 号时都能正确执行展开并重绘操作。

   graph.on('node:click', (evt) => {
     const { target } = evt;
     if (target.expandable) {
       graph.expandElement(target.id, { align: true });
       graph.draw();
     }
   });

---

参考文档

• expandElement API 文档
• 布局 position 配置示例
• 事件处理 API

---

后续建议

• 建议升级到最新版 G6 以获得更好的布局和交互支持。
• 如果仍有问题，建议提供自定义布局配置或关键代码片段，便于进一步定位问题。

如需详细代码示例或有其他疑问，欢迎补充说明！

---

此回复由 AI 助手自动生成。如有任何问题，我们的团队会尽快跟进。

[lyw405]

新节点没有位置信息，如果直接按照被展开节点位置算的话，可能会出现节点重叠的情况。那这就得重新渲染整个树，交互上可能又不太友好～

[lyw405]

创建新节点的位置需要知道被展开节点的位置，被展开节点的位置需要执行布局计算后才知道，布局计算需要所有的节点都在（包括新节点），但新节点的位置需要知道被展开节点的位置。 感觉布局系统的代码底层得重构了。