Javascript 将节点和链接转换为d3.js中的分层树

Javascript 将节点和链接转换为d3.js中的分层树,javascript,html,d3.js,tree,force-layout,Javascript,Html,D3.js,Tree,Force Layout,我有一个JSON表示一个图形(在我的例子中也是一个树),它看起来像这样: {"directed": true, "graph": [], "nodes": [{"time": 4, "id": 4551308, "name": "Alto da Boa Vista"}, {"time": 7, "id": 4551309, "name": "Sumare"}, ... "links": [{"source": 0, "target": 36, "weight": 1}, {"source":

我有一个JSON表示一个图形(在我的例子中也是一个树),它看起来像这样:

{"directed": true, "graph": [], 
"nodes": [{"time": 4, "id": 4551308, "name": "Alto da Boa Vista"}, {"time": 7, "id": 4551309, "name": "Sumare"},
...
"links": [{"source": 0, "target": 36, "weight": 1}, 
{"source": 1, "target": 36, "weight": 1},
...
为了使用它构建如本例中所示的树,我需要在一个层次对象中转换此JSON,其中子节点嵌套在父节点中,如下所示:

D3是否有一些内置函数可以将图形转换为树? 或者,您将如何从graph生成嵌套树JSON objetc


我在这个jsFiddle中有一个例子:

好的,这是一个由两部分组成的答案

第1部分: D3具有将数组转换为嵌套结构的内置功能。看看d3.nest()函数

  • API文档:
这主要用于分层布局:集群、包、分区、树映射

第二部分: 如果您试图实现类似于您发布的示例的布局,那么您不需要对数据做任何事情。该示例使用了需要图形的力布局。由于force布局可以处理任何形状的图形,而树只是一个遵循一些约束的图形,因此不需要进行任何转换。如果图形的形状恰好是一棵树,它将看起来像一棵树

这应该足够好了:

force
  .nodes(spread.nodes)
  .links(spread.links)
  .start();

使用force,我可以得到x,y位置,但它看起来不像树,所有节点都是随机的,我需要将它们设置为树或某种安排。请更新文档链接,以找到解决方案吗?我希望将我已经准备好的
节点
链接
json数组转换为分层格式的json,而无需重新编写完整的json生成代码。