从平面JSON可视化族图的JavaScript库建议

我有一个简单的JSON文件，其中包含人的姓名及其id，以及谁是谁的父母

该文件如下所示：

[  
{  
  "firstname":"harry",
  "id":"1",
  "relationship":"PARENT_OF",
  "firstname1":"jim",
  "id1":"2"

},
{  
  "firstname":"harry",
  "id":"1",
  "relationship":"PARENT_OF",
  "firstname1":"jessica",
  "id1":"3"

},
{  
  "firstname":"jessica",
  "id":"3",
  "relationship":"PARENT_OF",
  "firstname1":"peter",
  "id1":"4"

}
]

我正在尝试构建一个类似于图中所示的家庭图：

我一直在研究D3库，它有助于创建JSON文件嵌套且只有一个根的族谱

在我的例子中，JSON文件是平面的，可以有许多根（例如2个祖父母）

几天来，我一直试图用我拥有的数据和D3库制作一些东西，但没有成功

---

有人能告诉我D3是否可以实现这一点，如果没有，那么哪个JavaScript库最适合实现这一点吗？

是的，D3可以实现这一点，如果需要嵌套数据，则更改数据、过滤数据并根据需要嵌套。我发现的所有解决方案的问题是，它们假设只有一个根节点（只有一个叶，或者在其他示例中，只有一个子叶不是父叶）。在我的数据中，可能有3-4个子节点不是父节点，我很难正确嵌套。这就是我试图避免整个嵌套的原因。如果有帮助，我还有属性

level

，显示树层次结构中每个节点的位置（祖父母是level 4，他们的孩子是level 3，等等）难道你不能只添加一个人工单根，然后在数据中存在多个根时将其删除吗？@MarcoL是的，这是解决方案，但现在我有另一个问题。当嵌套数据时，如果一个子节点有两个父节点，在嵌套过程中，该子节点嵌套在两个父节点中，在可视化过程中，我得到重复节点s、 但是，这是一个不同的问题是的，这在d3中是可能的，如果你需要嵌套的数据，那么改变你的数据，过滤它，并根据需要嵌套它。我发现的所有解决方案的问题是，它们假设只有一个根节点（只有一个叶，或者在其他示例中只有一个子节点不是父节点）。在我的数据中，可能有3-4个子节点不是父节点，我很难正确嵌套。这就是我试图避免整个嵌套的原因。如果有帮助，我还有属性

level

，显示树层次结构中每个节点的位置（祖父母是level 4，他们的孩子是level 3，等等）难道你不能只添加一个人工单根，然后在数据中存在多个根时将其删除吗？@MarcoL是的，这是解决方案，但现在我有另一个问题。当嵌套数据时，如果一个子节点有两个父节点，在嵌套过程中，该子节点嵌套在两个父节点中，在可视化过程中，我得到重复节点s、 但是，这是一个不同的问题