yWorks Apply Automatic Layouts
Execute layout algorithms to automatically arrange graph elements.
Before Applying
Always query the yFiles MCP for current API:
yfiles:yfiles_search_by_description(query="layout algorithm")
yfiles:yfiles_get_symbol_details(name="HierarchicalLayout")
yfiles:yfiles_get_symbol_details(name="LayoutExecutor")
Quick Start
import { HierarchicalLayout, LayoutExecutor } from '@yfiles/yfiles'
await new LayoutExecutor({
graphComponent,
layout: new HierarchicalLayout(),
animationDuration: '0.5s'
}).start()
Choosing a Layout
| Graph type | Algorithm |
|---|---|
| Tree (no cycles) | TreeLayout |
| Directed / hierarchical | HierarchicalLayout |
| Undirected network | OrganicLayout |
| Center focus / star | RadialLayout |
| Orthogonal routing | OrthogonalLayout |
| Circular / cyclic | CircularLayout |
LayoutExecutor Options
new LayoutExecutor({
graphComponent, // Required
layout, // Required: ILayoutAlgorithm
layoutData, // Optional: layout-specific constraints/hints
animationDuration: '1s',
animateViewport: true,
easedAnimation: true
})
Additional Resources
references/algorithms.md— Per-algorithm configuration: HierarchicalLayout, OrganicLayout, TreeLayout, CircularLayout, OrthogonalLayout, RadialLayoutreferences/configuration.md— LayoutData, sequential layouts, partial layouts, incremental layouts, fixed nodesreferences/examples.md— Complete working code examples