多级分层边缘捆绑

Posted

技术标签:

【中文标题】多级分层边缘捆绑【英文标题】:Multilevel Hierarchical Edge Bundling 【发布时间】:2015-08-19 14:39:42 【问题描述】:

我想实现。我的意思是我想灌输径向树的行为,比如层次结构和边缘捆绑​​,就像在分层边缘捆绑中一样。

示例可视化是Radial Hierarchical bundling

我知道我需要为此使用两个 d3.js 布局。我还需要相应地更改我的 json 数据集。

我的示例数据集仅适用于普通 d3.js HEB

[
"name": "A", "imports": ["A1", "A2", "A3"],                    
"name": "B", "imports": ["B1", "B2", "B3"],                   
"name": "C", "imports": ["C1", "C2", "C3"],                   
"name": "Employees", "imports": ["Emp1", "Emp2", "Emp3"],        
"name": "A1", "imports": ["Emp1", "Emp2"],   
"name": "A2", "imports": ["Emp3", "Emp2"], 
"name": "A3", "imports": ["Emp1", "Emp3"],
"name": "C1", "imports": ["Emp1", "Emp3"],
"name": "C2", "imports": ["Emp2", "Emp3"],
"name": "C3", "imports": ["Emp1", "Emp2"],                             
"name": "B1", "imports": ["Emp1", "Emp3"],
"name": "B2", "imports": ["Emp2", "Emp3"],                                               
"name": "B3", "imports": ["Emp1", "Emp2"],                        
"name": "Emp1", "imports": ["A1","A3","B1","B3","C1","C3"],   
"name": "Emp3", "imports": ["A3","A2","B2","B1","C2","C1"],
"name": "Emp2", "imports": ["A1","A2","B2","B3","C2","C3"]
]

但是我想展示的关系是:

***别的A、B和C

A 是 A1,A2,A3 的父级

B 是 B1,B2,B3 的父级,

A 是 A1,A2,A3 的父级

C 是 C1,C2,C3 的父级,

因此,A1,A2,A3,B1,B2,B3,C1,C2,C3 处于第二级

然后,我想通过边缘捆绑显示 Emp1、Emp2 和 Emp3 与 A1-C3 的关系,如上数据集所示。

我希望我清楚这一点。所以,请告诉我如何显示这种行为或关系,以及需要对数据集进行哪些适当的更改。

【问题讨论】:

您是否设法创建了您的项目?我有兴趣在现实生活中看到它。感谢分享,如果可能的话。 【参考方案1】:

您的问题的近似解决方案是将以下 JSON 示例的改编版本保存在文本文件中(例如“test.json”):

[
"name": "A.A1", "imports": ["Emp.Emp1", "Emp.Emp2"],   
"name": "A.A2", "imports": ["Emp.Emp3", "Emp.Emp2"], 
"name": "A.A3", "imports": ["Emp.Emp1", "Emp.Emp3"],
"name": "C.C1", "imports": ["Emp.Emp1", "Emp.Emp3"],
"name": "C.C2", "imports": ["Emp.Emp2", "Emp.Emp3"],
"name": "C.C3", "imports": ["Emp.Emp1", "Emp.Emp2"],                             
"name": "B.B1", "imports": ["Emp.Emp1", "Emp.Emp3"],
"name": "B.B2", "imports": ["Emp.Emp2", "Emp.Emp3"],                                               
"name": "B.B3", "imports": ["Emp.Emp1", "Emp.Emp2"],                        
"name": "Emp.Emp1", "imports": ["A.A1","A.A3","B.B1","B.B3","C.C1","C.C3"],   
"name": "Emp.Emp3", "imports": ["A.A3","A.A2","B.B2","B.B1","C.C2","C.C1"],
"name": "Emp.Emp2", "imports": ["A.A1","A.A2","B.B2","B.B3","C.C2","C.C3"]
]

然后使用 R 使用 edgebundleR 包生成 D3 边束图:

install.packages("devtools")
devtools::install_github("garthtarr/edgebundleR")
setwd("path/to/dir/with/file")
edgebundle("test.json")

这是结果的截图:

【讨论】:

以上是关于多级分层边缘捆绑的主要内容,如果未能解决你的问题,请参考以下文章

多级页表——分层分页

Laravel 多级分层用户系统

多级缓存的分层架构

多级和分层状态机的设计

深入缓存核心技术:大型网站多级缓存的分层架构

BizTalk适配器生成分层架构