Common Layout Configuration Options
Previous
ComboCombined
Next
CompactBox
Loading...
This article introduces the common attribute configurations for built-in layouts.
Property | Description | Type | Default | Required |
---|---|---|---|---|
type | Layout type, name of built-in or custom layout | Type | - | ✓ |
isLayoutInvisibleNodes | Whether invisible nodes participate in the layout | boolean | false | |
nodeFilter | Nodes participating in the layout | (node: NodeData) => boolean | () => true | |
preLayout | Use pre-layout, calculate layout before initializing elements | boolean | false | |
enableWorker | Whether to run the layout in a WebWorker | boolean | - | |
iterations | Number of iterations for iterative layout | number | - |
Specifies the layout type, either the name of a built-in layout type or a custom layout.
const graph = new Graph({// Other configurations...layout: {type: 'antv-dagre',},});
Optional values include:
antv-dagre
: Custom layout based on dagrecircular
: Circular layoutcombo-combined
: Layout suitable for combinationsconcentric
: Concentric layoutd3-force
: Force-directed layout based on D3d3-force-3d
: 3D Force-directed layoutdagre
: Dagre layoutfishbone
: Fishbone layoutforce
: Force-directed layoutforce-atlas2
: ForceAtlas2 layoutfruchterman
: Fruchterman layoutgrid
: Grid layoutmds
: High-dimensional data dimensionality reduction layoutradial
: Radial layoutrandom
: Random layoutsnake
: Snake layoutcompact-box
: Compact tree layoutdendrogram
: Dendrogram layoutmindmap
: Mindmap layoutindented
: Indented tree layout