自动布局
此示例展示了如何在从侧边栏添加项目后自动排列节点。这是工作流编辑器的常见 UI 模式,可让你快速创建流程。每次图形发生变化时都会计算布局。
¥This example shows how you can automatically arrange nodes after adding items from a sidebar. This a common UI pattern for workflow editors and lets you create a flow quickly. The layout is calculated every time the graph changes.
This is a Pro example. Get all pro examples, templates, 1:1 support from the xyflow team and prioritized Github issues with a React Flow Pro subscription.
关于此 Pro 示例
¥About this Pro Example
-
订阅后,你将可以访问此示例的两个不同版本:一个使用 d3-hierarchy ,另一个使用 dagre.js 作为布局引擎。
¥Once subscribed, you’ll get access to two different versions of this example: One using d3-hierarchy and the other one using dagre.js as a layout engine.
-
依赖:reactflow 、d3-hierarchy 或 dagre
¥Dependencies: reactflow , d3-hierarchy or dagre