关系扩线

# 关系扩线

提示

在关系数据分析过程中，经常会遇到关系扩线的操作，通过某一个节点查找他的关联关系，动态的将查询到的关系数据追加到当前图上，从而实现一步步的数据线索探查，由点扩面的深入分析。

# 关系扩线的要求

不影响画布中当前已展示的数据 新增数据需要摆放在合理的空间位置上，尽量避免交叉遮挡

# 数据扩展接口

组件库提供了动态数据添加接口 activeAddData(centerNode, incrementData, layoutType, config) 来对新查询到的数据进行合并和新增。

参数 参数名 说明 centerNode 中心节点 扩展数据的中心节点 incrementData 关系数据 标准格式的关系数据，如：{nodes:[],links:[]} layoutType 布局类型 默认：fastForce config 扩展配置 扩展的配置，需要指定业务系统定义节点大小，扩展区域最小半径， 如：{nodeRadius: 30,minCircleRadius: 150}

# 关系扩展应用示例

let graphVis = new GraphVis({ container:document.getElementById('graph-container'), licenseKey:'licensekey' //授权license }); //注册节点双击事件 graphVis.registEventListener('node','dblClick',function(event,node){ var searchData = generateData(node); //模拟服务端数据查询结果 graphVis.activeAddData(node,searchData,'fastForce',{nodeRadius: 40,minCircleRadius: 150});//动态追加数据 }); const demoData = { nodes:[ {id:1000,label:'节点一',y:300,x:200}, {id:2000,label:'节点二',y:100,x:400}, {id:3000,label:'节点三',y:300,x:600}, {id:4000,label:'节点四',y:100,x:800}, {id:5000,label:'节点五',y:300,x:1000} ], links:[ {id:'e-10',source:1000,target:2000,label:'关系一'}, {id:'e-20',source:2000,target:3000,label:'关系二'}, {id:'e-30',source:3000,target:4000,label:'关系三'}, {id:'e-40',source:4000,target:5000,label:'关系四'}, {id:'e-50',source:4000,target:2000,label:'关系A'}, {id:'e-60',source:3000,target:1000,label:'关系B'}, {id:'e-70',source:5000,target:3000,label:'关系A'} ] }; graphVis.addGraph(demoData); //批量绘图 graphVis.setZoom('auto'); //模拟服务端查询关系数据 function generateData(node){ var sourceId = node.id; var nodeNum = Math.round(Math.random()*50); var newNodes = []; var newLinks = []; for(var i=0;i<nodeNum;i++){ var nodeId = Math.round(Math.random()*1000000)+1; newNodes.push({id:nodeId,label:'点'+nodeId}); var edgeId = Math.round(Math.random()*1000000)+1; newLinks.push({ id:'e-'+edgeId,source:sourceId,target:nodeId,label:edgeId }); } return {nodes:newNodes,links:newLinks}; }

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

# 关系扩线实例图

网址：关系扩线 http://www.mxgxt.com/news/view/1063058

相关内容

胎儿肠管扩张和孕妇饮食有关系吗
慢慢褪去最后一道防线！某明星被曝出与经纪人关系暧昧，绯闻不断扩大
太阳合相木星：扩张性合作关系
合相太阳合相木星：扩张性合作关系
三只松鼠：上市一年，迈过百亿门槛，通过品类扩张和线下扩展打造第二增长极
公司注册资本与估值、增资扩股与估值有什么关系？ 编文
海阳科技产能 “内卷” 下逆势扩产 同业竞争关系成焦点
哈哈哈，扩散扩散扩散，今晚群战啊，哈哈哈
侄子的关系及其相关知识扩展
芜湖企业开办“一日办结”系统再扩容

随便看看