vis.js学习(2)

需求

设计节点的实体及关系样式,如果在json中设置,会发现出现大量的重复的数据,所以把每个实体类型单独拿出来作为组(group)

代码

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
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
var options = {
nodes: {
shape: 'dot',
font: {
face: 'Tahoma'
},
borderWidth:1.5,
scaling:{
label: {
min: 1,
max: 5
}
},
font: {size:12, color:'#626568'}
},
edges: {
width: 0.2,
smooth: {
type: 'continuous'
},
arrows: "to",
},
groups: {
Person: {
shape: "circularImage",
image: "./images/Person.png",
color: {
background: "#fff",
border: "#022240",
highlight: {
"border": "#d70007",
"background": "#fec40a"
}
}
},
Woman: {
shape: "circularImage",
image: "./images/Woman.png",
color: {
background: "#fff",
border: "#022240",
highlight: {
"border": "#d70007",
"background": "#fec40a"
}
}
},
Insurgent: {
shape: "circularImage",
image: "./images/Insurgent.png",
color: {
background: "#fff",
border: "#022240",
highlight: {
"border": "#d70007",
"background": "#fec40a"
}
}
}
},
interaction: {
},
physics: false
};