Option = {the let
the backgroundColor: '# 1a4377',
animationDurationUpdate: 1500, animation // update the changing time
animationEasingUpdate: 'quinticInOut', // animation easing effect
Series: [
{
type: 'Graph', // select diagram
layout: 'force', // 'none' bureau no, need to add coordinates, 'circular' annular layout, 'force' the guide arrangement, the effect is random
Force: {
repulsion: 1000, repulsive force between nodes @
edgeLength: 50 / the distance between / two nodes, by repulsion impact
},
ROAM: to true,
label: node {// word global style
Normal: {
Show: to true,
Color: '#fff'
}
},
ItemStyle: Node {// circle global style
Normal: {
// the borderColor: '#fff',
// borderWidth:. 1,
// the shadowBlur:. 1,
shadowColor @: 'RGBA (0, 0, 0, 0.3)'
}
},
focusNodeAdjacency: to true, when a node // hovers projecting relationship with it a node, other nodes dilute unrelated
data: [// each node data
{
ID: 'A1',
name: 'campus big data',
SymbolSize: 120, each node determines // Size
draggable: true, // draggable
category: 0, // node classification between
itemStyle: {// custom styles of each circle
Normal: {
the borderColor : '# b457ff',
borderWidth:. 1,
the shadowBlur: 20 is,
shadowColor: '# b457ff',
Color: new new echarts.graphic.RadialGradient (0.5, 0.5, 1.0, [// gradient from the center to the surrounding
{
offset: 0,
Color: "RGBA (180 [, 87, 255, 0.1)"
},
{
offset:. 1,
Color: "RGBA (180 [, 87, 255,. 1)"
}
]),
}
}
},
{
ID: '2',
name: 'big public opinion data',
SymbolSize: 100,
ItemStyle: {
Normal: {
borderColor: '#04f2a7',
borderWidth: 1,
shadowBlur: 10,
shadowColor: '#04f2a7',
color: new echarts.graphic.RadialGradient(0.5, 0.5, 1.0, [
{
offset: 0,
color: "rgba(4, 242, 164, 0.1)"
},
{
offset: 1,
color: "rgba(4, 242, 164, 1)"
}
]),
}
},
category: 1,
},
{
id: '3',
name: '用户分析',
symbolSize: 80,
category: 1,
itemStyle: {
normal: {
borderColor: '#04f2a7',
borderWidth: 1,
shadowBlur: 10,
shadowColor: '#04f2a7',
color: new echarts.graphic.RadialGradient(0.5, 0.5, 1.0, [
{
offset: 0,
Color: "RGBA (. 4, 242, 164 is, 0.1)"
},
{
offset:. 1,
Color: "RGBA (. 4, 242, 164 is,. 1)"
}
]),
}
},
},
{
ID : '. 4',
name: 'topic analysis',
SymbolSize: 80,
category:. 1,
ItemStyle: {
normal: {
borderColor: '#04f2a7',
borderWidth: 1,
shadowBlur: 10,
shadowColor: '#04f2a7',
color: new echarts.graphic.RadialGradient(0.5, 0.5, 1.0, [
{
offset: 0,
color: "rgba(4, 242, 164, 0.1)"
},
{
offset: 1,
color: "rgba(4, 242, 164, 1)"
}
]),
}
},
},
{
id: '5',
name: '评论分析',
symbolSize: 80,
category: 1,
itemStyle: {
normal: {
borderColor: '#04f2a7',
borderWidth: 1,
shadowBlur: 10,
shadowColor: '#04f2a7',
color: new echarts.graphic.RadialGradient(0.5, 0.5, 1.0, [
{
offset: 0,
Color: "RGBA (. 4, 242, 164 is, 0.1)"
},
{
offset:. 1,
Color: "RGBA (. 4, 242, 164 is,. 1)"
}
]),
}
},
},
{
ID : '. 6',
name: 'analysis of Library',
SymbolSize: 100,
category: 2,
ItemStyle: {
normal: {
borderColor: '#82dffe',
borderWidth: 1,
shadowBlur: 10,
shadowColor: '#82dffe',
color: new echarts.graphic.RadialGradient(0.5, 0.5, 1.0, [
{
offset: 0,
color: "rgba(130, 223, 254, 0.1)"
},
{
offset: 1,
color: "rgba(130, 223, 254, 1)"
}
]),
}
},
},
{
id: '7',
name: '借阅分析',
symbolSize:80,
category: 2,
itemStyle: {
normal: {
borderColor: '#82dffe',
borderWidth: 1,
shadowBlur: 10,
shadowColor: '#82dffe',
color: new echarts.graphic.RadialGradient(0.5, 0.5, 1.0, [
{
offset: 0,
Color: "RGBA (130., 223, 254, 0.1)"
},
{
offset:. 1,
Color: "RGBA (130., 223, 254,. 1)"
}
]),
}
},
},
{
ID : '. 8',
name: 'borrow Ranking',
SymbolSize: 80,
ItemStyle: {
Normal: {
borderColor: '#82dffe',
borderWidth: 1,
shadowBlur: 10,
shadowColor: '#82dffe',
color: new echarts.graphic.RadialGradient(0.5, 0.5, 1.0, [
{
offset: 0,
color: "rgba(130, 223, 254, 0.1)"
},
{
offset: 1,
color: "rgba(130, 223, 254, 1)"
}
]),
}
},
category: 2,
},
{
id: '9',
name: '图书收录',
symbolSize:80,
itemStyle: {
normal: {
borderColor: '#82dffe',
borderWidth: 1,
shadowBlur: 10,
shadowColor: '#82dffe',
color: new echarts.graphic.RadialGradient(0.5, 0.5, 1.0, [
{
offset: 0,
color: "rgba(130, 223, 254, 0.1)"
},
{
offset: 1,
color: "rgba(130, 223, 254, 1)"
}
]),
}
},
category: 2,
},
{
id: '10',
name: '图书分析',
symbolSize:80,
category: 2,
itemStyle: {
normal: {
borderColor: '#82dffe',
borderWidth: 1,
shadowBlur: 10,
shadowColor: '#82dffe',
color: new echarts.graphic.RadialGradient(0.5, 0.5, 1.0, [
{
offset: 0,
color: "rgba(130, 223, 254, 0.1)"
},
{
offset: 1,
color: "rgba(130, 223, 254, 1)"
}
]),
}
},
}],
Links: [// relationships between the respective nodes, can pass id or name, where the selected id
{
Source: 'A1',
target: '2'
},
{
Source: '2',
target: '. 3',
},
{
Source: '2',
target: '. 4',
},
{
Source: '2',
target: '. 5',
},
{
source: 'a1',
target: '6',
},
{
source: '6',
target: '10',
},
{
source: '6',
target: '7',
},
{
source: '6',
target: '8',
},
{
source: '6',
target: '9'
}
],
lineStyle:{// connection style
normal: {
Opacity: 0.9,
width:. 1,
curveness: // 0 degree of bend lines, 0 represents a straight line, the greater the value bent
}
}
}
]
};
the let myChart = echarts.init (document.getElementById ( 'Relate'));
myChart .setOption (option);echarts diagram center color gradient
Guess you like
Origin www.cnblogs.com/zhanyuefeixian/p/11943709.html
Recommended
Ranking