图谱可视化echarts graph配置项内容和展示
配置项如下
let res_json = {
"data": [{
"draggable": "true",
"symbolSize": 40,
"name": "\"茯苓\"",
"id": "\"n562\"",
"text": "\"茯苓\":\"药物\"",
"category": 2,
"value": "\"茯苓\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"生姜\"",
"id": "\"n456\"",
"text": "\"生姜\":\"药物\"",
"category": 2,
"value": "\"生姜\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"或小便利\"",
"id": "\"n1945\"",
"text": "\"或小便利\":\"证候表现\"",
"category": 4,
"value": "\"或小便利\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"或呕\"",
"id": "\"n1947\"",
"text": "\"或呕\":\"证候表现\"",
"category": 4,
"value": "\"或呕\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"太阳病发...解\"",
"id": "\"n842\"",
"text": "\"太阳病发汗，汗出不解\":\"病因病机\"",
"category": 3,
"value": "\"太阳病发...解\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"振振欲擗地\"",
"id": "\"n841\"",
"text": "\"振振欲擗地\":\"证候表现\"",
"category": 4,
"value": "\"振振欲擗地\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"少阴病\"",
"id": "\"n1839\"",
"text": "\"少阴病\":\"病证\"",
"category": 5,
"value": "\"少阴病\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"头眩\"",
"id": "\"n839\"",
"text": "\"头眩\":\"证候表现\"",
"category": 4,
"value": "\"头眩\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"或下利\"",
"id": "\"n1946\"",
"text": "\"或下利\":\"证候表现\"",
"category": 4,
"value": "\"或下利\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"自下利\"",
"id": "\"n1943\"",
"text": "\"自下利\":\"证候表现\"",
"category": 4,
"value": "\"自下利\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"小便不利\"",
"id": "\"n349\"",
"text": "\"小便不利\":\"证候表现\"",
"category": 4,
"value": "\"小便不利\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"芍药\"",
"id": "\"n452\"",
"text": "\"芍药\":\"药物\"",
"category": 2,
"value": "\"芍药\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"细辛\"",
"id": "\"n655\"",
"text": "\"细辛\":\"药物\"",
"category": 2,
"value": "\"细辛\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"加减\"",
"id": "\"m1616\"",
"text": "\"加减\":\"虚拟节点\"",
"category": 1,
"value": "\"加减\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"腹痛\"",
"id": "\"n1908\"",
"text": "\"腹痛\":\"证候表现\"",
"category": 4,
"value": "\"腹痛\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"干姜\"",
"id": "\"n568\"",
"text": "\"干姜\":\"药物\"",
"category": 2,
"value": "\"干姜\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"有水气\"",
"id": "\"n1948\"",
"text": "\"有水气\":\"病因病机\"",
"category": 3,
"value": "\"有水气\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"加减\"",
"id": "\"m1618\"",
"text": "\"加减\":\"虚拟节点\"",
"category": 1,
"value": "\"加减\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"组成\"",
"id": "\"m1622\"",
"text": "\"组成\":\"虚拟节点\"",
"category": 1,
"value": "\"组成\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"身瞤动\"",
"id": "\"n840\"",
"text": "\"身瞤动\":\"证候表现\"",
"category": 4,
"value": "\"身瞤动\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"四肢沉重疼痛\"",
"id": "\"n1942\"",
"text": "\"四肢沉重疼痛\":\"证候表现\"",
"category": 4,
"value": "\"四肢沉重疼痛\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"白术\"",
"id": "\"n561\"",
"text": "\"白术\":\"药物\"",
"category": 2,
"value": "\"白术\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"辨治\"",
"id": "\"m1621\"",
"text": "\"辨治\":\"虚拟节点\"",
"category": 1,
"value": "\"辨治\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"组成\"",
"id": "\"m515\"",
"text": "\"组成\":\"虚拟节点\"",
"category": 1,
"value": "\"组成\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"辨治\"",
"id": "\"m514\"",
"text": "\"辨治\":\"虚拟节点\"",
"category": 1,
"value": "\"辨治\""
}, {
"draggable": "true",
"symbolSize": 60,
"name": "\"真武汤\"",
"id": "\"n843\"",
"text": "\"真武汤\":\"方剂\"",
"category": 0,
"value": "\"真武汤\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"附子\"",
"id": "\"n492\"",
"text": "\"附子\":\"药物\"",
"category": 2,
"value": "\"附子\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"心下悸\"",
"id": "\"n838\"",
"text": "\"心下悸\":\"证候表现\"",
"category": 4,
"value": "\"心下悸\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"加减\"",
"id": "\"m1617\"",
"text": "\"加减\":\"虚拟节点\"",
"category": 1,
"value": "\"加减\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"五味子\"",
"id": "\"n656\"",
"text": "\"五味子\":\"药物\"",
"category": 2,
"value": "\"五味子\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"发热\"",
"id": "\"n31\"",
"text": "\"发热\":\"证候表现\"",
"category": 4,
"value": "\"发热\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"或咳\"",
"id": "\"n1944\"",
"text": "\"或咳\":\"证候表现\"",
"category": 4,
"value": "\"或咳\""
}, {
"draggable": "true",
"symbolSize": 40,
"name": "\"加减\"",
"id": "\"m1615\"",
"text": "\"加减\":\"虚拟节点\"",
"category": 1,
"value": "\"加减\""
}],
"links": [{
"source": "\"n843\"",
"value": "\"加减\"",
"target": "\"m1618\""
}, {
"source": "\"m514\"",
"value": "\"辨治\"",
"target": "\"n561\""
}, {
"source": "\"m514\"",
"value": "\"辨治\"",
"target": "\"n452\""
}, {
"source": "\"m514\"",
"value": "\"辨治\"",
"target": "\"n840\""
}, {
"source": "\"n843\"",
"value": "\"组成\"",
"target": "\"m515\""
}, {
"source": "\"m514\"",
"value": "\"辨治\"",
"target": "\"n456\""
}, {
"source": "\"n843\"",
"value": "\"组成\"",
"target": "\"m1622\""
}, {
"source": "\"m1621\"",
"value": "\"辨治\"",
"target": "\"n1944\""
}, {
"source": "\"m515\"",
"value": "\"组成\"",
"target": "\"n561\""
}, {
"source": "\"m1618\"",
"value": "\"药物\"",
"target": "\"n492\""
}, {
"source": "\"m515\"",
"value": "\"组成\"",
"target": "\"n452\""
}, {
"source": "\"m515\"",
"value": "\"组成\"",
"target": "\"n456\""
}, {
"source": "\"n843\"",
"value": "\"加减\"",
"target": "\"m1615\""
}, {
"source": "\"m1615\"",
"value": "\"药物\"",
"target": "\"n655\""
}, {
"source": "\"m1621\"",
"value": "\"辨治\"",
"target": "\"n1945\""
}, {
"source": "\"m1621\"",
"value": "\"辨治\"",
"target": "\"n1942\""
}, {
"source": "\"m514\"",
"value": "\"辨治\"",
"target": "\"n839\""
}, {
"source": "\"m1617\"",
"value": "\"药物\"",
"target": "\"n568\""
}, {
"source": "\"n843\"",
"value": "\"加减\"",
"target": "\"m1616\""
}, {
"source": "\"m1621\"",
"value": "\"辨治\"",
"target": "\"n1947\""
}, {
"source": "\"m514\"",
"value": "\"辨治\"",
"target": "\"n842\""
}, {
"source": "\"m1617\"",
"value": "\"药物\"",
"target": "\"n452\""
}, {
"source": "\"m1621\"",
"value": "\"辨治\"",
"target": "\"n1946\""
}, {
"source": "\"m1616\"",
"value": "\"药物\"",
"target": "\"n562\""
}, {
"source": "\"m1621\"",
"value": "\"辨治\"",
"target": "\"n349\""
}, {
"source": "\"m1615\"",
"value": "\"药物\"",
"target": "\"n656\""
}, {
"source": "\"m1622\"",
"value": "\"组成\"",
"target": "\"n456\""
}, {
"source": "\"m514\"",
"value": "\"辨治\"",
"target": "\"n838\""
}, {
"source": "\"m1622\"",
"value": "\"组成\"",
"target": "\"n452\""
}, {
"source": "\"m1622\"",
"value": "\"组成\"",
"target": "\"n561\""
}, {
"source": "\"m514\"",
"value": "\"辨治\"",
"target": "\"n492\""
}, {
"source": "\"m1618\"",
"value": "\"药物\"",
"target": "\"n456\""
}, {
"source": "\"m1621\"",
"value": "\"辨治\"",
"target": "\"n1908\""
}, {
"source": "\"m514\"",
"value": "\"辨治\"",
"target": "\"n562\""
}, {
"source": "\"m1621\"",
"value": "\"辨治\"",
"target": "\"n1839\""
}, {
"source": "\"n843\"",
"value": "\"加减\"",
"target": "\"m1617\""
}, {
"source": "\"m514\"",
"value": "\"辨治\"",
"target": "\"n31\""
}, {
"source": "\"m1621\"",
"value": "\"辨治\"",
"target": "\"n1948\""
}, {
"source": "\"m514\"",
"value": "\"辨治\"",
"target": "\"n841\""
}, {
"source": "\"n843\"",
"value": "\"辨治\"",
"target": "\"m1621\""
}, {
"source": "\"n843\"",
"value": "\"辨治\"",
"target": "\"m514\""
}, {
"source": "\"m1621\"",
"value": "\"辨治\"",
"target": "\"n1943\""
}, {
"source": "\"m1615\"",
"value": "\"药物\"",
"target": "\"n568\""
}, {
"source": "\"m1622\"",
"value": "\"组成\"",
"target": "\"n562\""
}, {
"source": "\"m515\"",
"value": "\"组成\"",
"target": "\"n492\""
}, {
"source": "\"m1622\"",
"value": "\"组成\"",
"target": "\"n492\""
}, {
"source": "\"m515\"",
"value": "\"组成\"",
"target": "\"n562\""
}],
"categories": [{
"name": "\"方剂\""
}, {
"name": "\"虚拟节点\""
}, {
"name": "\"药物\""
}, {
"name": "\"病因病机\""
}, {
"name": "\"证候表现\""
}, {
"name": "\"病证\""
}],
"message": "success",
"status": 200
}
let data = res_json.data;
let links = res_json.links;
let categories = res_json.categories;
option = {
color: [
'#ff7f50',
'#87cefa',
'#da70d6',
'#cd7033',
'#6495ed',
'#ff69b4',
'#ba55d3',
'#cd5c5c',
'#ff0d32',
'#40e0d0',
'#1e90ff',
'#ff6347',
'#7b68ee',
'#d0648a',
'#09b0ff',
'#6b8e23',
'#4ea397',
'#3cb371',
'#b8860b',
'#7bd9a5'
],
tooltip: {},
legend: [{
x: 'center',
y: 'top',
orient: 'horizontal',
data: categories.map(function(a) {
return a.name;
}),
}],
zoom: 2.0,
animation: true,
series: [{
type: 'graph',
layout: 'force',
symbolSize: function(size) {
return size;
},
edgeSymbol: ['circle', 'arrow'],
edgeSymbolSize: [4, 10],
edgeLabel: {
normal: {
show: true,
textStyle: {
fontSize: 10
},
formatter: "{c}"
}
},
force: {
repulsion: 2500,
edgeLength: [10, 50]
},
focusNodeAdjacency: true,
roam: true,
data: data,
links: links,
categories: categories,
label: {
normal: {
show: true,
textStyle: {
fontSize: 12
},
}
},
force: {
repulsion: 1000
},
tooltip: {
formatter: function(node) { // 区分连线和节点，节点上额外显示其他数字
return node.data.text;
},
},
lineStyle: {
normal: {
opacity: 0.9,
width: 1,
curveness: 0.3
}
},
}]
};
myChart.setOption(option);
截图如下
