-
Notifications
You must be signed in to change notification settings - Fork 1.3k
/
layout-dendrogram-tb.ts
41 lines (38 loc) · 1.09 KB
/
layout-dendrogram-tb.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
import { Graph, Utils } from '@/src';
import data from '@@/dataset/algorithm-category.json';
import type { STDTestCase } from '../types';
export const layoutDendrogramTb: STDTestCase = async (context) => {
const graph = new Graph({
...context,
autoFit: 'view',
data: Utils.treeToGraphData(data),
node: {
style: (model) => {
const hasChildren = !!model.style!.children?.length;
return {
labelMaxWidth: 200,
labelPlacement: hasChildren ? 'right' : 'bottom',
labelText: model.id,
labelTextAlign: 'start',
labelTextBaseline: hasChildren ? 'middle' : 'bottom',
transform: hasChildren ? '' : 'rotate(90)',
ports: [{ placement: 'bottom' }, { placement: 'top' }],
};
},
},
edge: {
style: {
type: 'cubic-vertical',
},
},
layout: {
type: 'dendrogram',
direction: 'TB',
nodeSep: 40,
rankSep: 100,
},
behaviors: ['drag-canvas', 'zoom-canvas', 'drag-element', 'collapse-expand-tree'],
});
await graph.render();
return graph;
};