Question

我想实现多级分层边缘捆绑。通过这个我的意思是我想像分层边缘捆绑一样灌输径向树的行为，如层次结构和边缘捆绑。

我知道我需要使用两个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的关系，如上面的数据集所示。

我希望我对此很清楚。那么，请告诉我如何显示此行为或关系以及需要在数据集中进行哪些适当的更改。

Answer 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")

以下是结果的屏幕截图：

多级分层边缘捆绑

1 个答案: