在d3js中从一个强制有向图转换到另一个图

时间:2014-01-14 19:59:54

标签: d3.js tree transition force-layout

我有两个可折叠力树用于相同的节点。

我还没有看到一个例子,我们可以通过d3js中的节点转换和边缘重建从一棵树转换到另一棵树。

有没有办法做到这一点?

另一个相关问题,我们是否可以初始化强制有向图的每个节点的位置?

编辑:这是example。我有两棵树,链接是一棵树,我有另一棵树,它有相同的分子,但树的结构不同。我想如果我可以在不同的树之间为相同的分子或实体制作动画,那将是很好的。

1 个答案:

答案 0 :(得分:8)

原则上,这些是要遵循的步骤。

  • 停止强制布局以冻结节点的位置。
  • 消除链接(例如淡出)。
  • 将节点转换到新位置。这可以通过在旧数据上设置新位置或完全更改数据然后使用与tick处理程序中相同的代码来完成,以实现具有转换的强制布局
  • 重新添加链接。
  • 如果新布局也使用了力布局,请启动它。

我已经实现了这个here的示例。我使用两组数据和两个强制布局。首先,仅显示第一个力布局的节点和链接,第二个仅在后台运行。然后,第一个停止,我按照上面列出的步骤。

这不能满足所有要求(例如关于节点应如何转换),但可以作为这种实现的起点。