基於 Echarts實現簡單網路拓撲
阿新 • • 發佈:2018-11-09
option = {
title: {
text: '簡單網路拓撲'
},
tooltip: {},
animationDurationUpdate: 1500,
animationEasingUpdate: 'quinticInOut',
series : [
{
type: 'graph',
layout: 'none',
symbolSize: 50,
roam: true,
label: {
normal: {
show: true
}
},
edgeSymbol: ['circle', 'arrow'],
edgeSymbolSize: [4, 10],
edgeLabel: {
normal: {
textStyle: {
fontSize: 20
}
}
},
data: [{
name: '伺服器1',
x: 100,
y: 100
}, {
name: '伺服器2',
x: 220,
y: 310
}, {
name: '路由器',
x: 100,
y: 200
}, {
name: '伺服器4',
x: 10,
y: 300
}],
// links: [],
links: [{
source: '路由器',
target: '伺服器1'
}, {
source: '路由器',
target: '伺服器2'
}, {
source: '路由器',
target: '伺服器4'
}],
lineStyle: {
normal: {
opacity: 0.9,
width: 2,
curveness: 0
}
}
}
]
};