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, RadialLayout
• references/configuration.md — LayoutData, sequential layouts, partial layouts, incremental layouts, fixed nodes
• references/examples.md — Complete working code examples