因为数据要展示双向关系，最终选用了cytoscape.js。
效果如图，echarts只能显示单项数据关系。
据我理解，这个插件分两种，一种是基于jquery的，另一种是原声的。
基于jquery是加在jquery对象上的。因为基于jquery的无法在线上显示关系。最终选择了原生
cy=cytoscape({container:document.getElementById('echart'),//容器名字boxSelectionEnabled:false,autounselectify:true,
style:cytoscape.stylesheet().selector('node')//节点样式.css({'content':'data(name)','text-valign':'center','color':'white',"height":60,"width":60,'text-outline-width':2,'text-outline-color':'#316383',//颜色设置"background-color":"#316383","label":"data(label)"}).selector('edge')//边线样式.css({'curve-style':'bezier',"label":"data(label)",'target-arrow-shape':'triangle','target-arrow-color':'black','line-color':'#ccc','width':1}).selector(':selected').css({'content':'data(value)','background-color':'red','line-color':'red','target-arrow-color':'red','source-arrow-color':'red'}).selector('.background').css({"text-background-opacity":1,"text-background-color":"#ccc","text-background-shape":"roundrectangle","text-border-color":"#000","text-border-width":1,"text-border-opacity":1}).selector('node[label="main"]')//主节点样式设置.css({"background-color":'#d0413e','text-outline-width':2,'text-outline-color':'#d0413e',
}).selector('.faded').css({'opacity':0.25,'text-opacity':0}),/*style:[{selector:'node',css:{'content':'data(name)','text-valign':'center','color':'white',"height":40,"width":40,'text-outline-width':2,'text-outline-color':'#6dce9e',"background-color":"#6dce9e","label":"data(label)"}},
{selector:'edge',css:{'curve-style':'bezier',"label":"data(label)",'target-arrow-shape':'triangle','target-arrow-color':'#ccc','line-color':'#ccc','width':1}}],*/elements:data.elements//
});
varlayout=cy.layout({name:'concentric',这是控制图形形状的fit:true,padding:30,//thepaddingonfitstartAngle:4/2*Math.PI,//wherenodesstartinradianssweep:undefined,//howmanyradiansshouldbebetweenthefirstandlastnode(defaultstofullcircle)clockwise:true,//whetherthelayoutshouldgoclockwise(true)orcounterclockwise/anticlockwise(false)equidistant:false,//whetherlevelshaveanequalradialdistancebetwenthem,maycauseboundingboxoverflowminNodeSpacing:100//minspacingbetweenoutsideofnodes(usedforradiusadjustment)});layout.run();这就是简单的初始化及一些配置。