-
Notifications
You must be signed in to change notification settings - Fork 1.3k
/
layout-grid.ts
43 lines (39 loc) · 974 Bytes
/
layout-grid.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
42
43
import { Graph } from '@/src';
import data from '@@/dataset/cluster.json';
import type { STDTestCase } from '../types';
export const layoutGrid: STDTestCase = async (context) => {
const graph = new Graph({
...context,
data,
node: {
style: {
labelText: (d) => d.id,
},
},
layout: {
type: 'grid',
sortBy: 'cluster',
},
behaviors: ['zoom-canvas', 'drag-canvas', 'drag-element', 'click-select'],
});
await graph.render();
layoutGrid.form = (panel) => {
const config = {
sortBy: 'degree',
};
return [
panel
.add(config, 'sortBy', {
ID: 'id',
Degree: 'degree',
Cluster: (n1: any, n2: any) => Number(n2.data.cluster) - Number(n1.data.cluster),
})
.name('sortBy')
.onChange((value: string) => {
graph.setLayout({ type: 'grid', sortBy: value });
graph.layout();
}),
];
};
return graph;
};