in seatunnel-ui/src/views/task/synchronization-definition/dag/canvas/dag-shape.ts [90:170]
export function formatLayout(
graph: any,
formatType: 'grid' | 'dagre' = 'dagre',
cols?: number,
rows?: number
) {
let layoutFunc : any = null
const layoutConfig: any = {
nodesep: 50,
padding: 50,
ranksep: 50,
type: formatType
}
if (formatType === 'grid') {
layoutConfig['cols'] = cols
layoutConfig['rows'] = rows
}
if (!graph) {
return
}
graph.cleanSelection()
if (layoutConfig.type === 'dagre') {
layoutFunc = new DagreLayout({
type: 'dagre',
rankdir: 'LR',
align: 'UL',
// Calculate the node spacing based on the edge label length
ranksepFunc: (d) => {
const edges = graph.getOutgoingEdges(d.id)
let max = 0
if (edges && edges.length > 0) {
edges.forEach((edge: any) => {
const edgeView = graph.findViewByCell(edge)
const labelView = edgeView?.findAttr(
'width',
_.get(edgeView, ['labelSelectors', '0', 'body'], null)
)
const labelWidth = labelView ? +labelView : 0
max = Math.max(max, labelWidth)
})
}
return layoutConfig.ranksep + max
},
nodesep: layoutConfig.nodesep,
controlPoints: true
})
} else if (layoutConfig.type === 'grid') {
layoutFunc = new GridLayout({
type: 'grid',
preventOverlap: true,
preventOverlapPadding: layoutConfig.padding,
sortBy: '_index',
rows: layoutConfig.rows || undefined,
cols: layoutConfig.cols || undefined,
nodeSize: 220
})
}
const json = graph.toJSON()
const nodes = json.cells
.filter((cell: any) => cell.shape === DagNodeName)
.map((item: any) => {
return {
...item,
// sort by code aesc
_index: -(item.id as string)
}
})
const edges = json.cells.filter((cell: any) => cell.shape === DagEdgeName)
const newModel: any = layoutFunc?.layout({
nodes,
edges
} as any)
graph.fromJSON(newModel)
}