如何使用 d3 及其力布局构建树？

Question

我正在尝试以树的形式排列我的节点。目前，我正在处理here的这个示例。目前，我依赖于力导向布局，但正在尝试对其进行修改，以便我可以获得具有预定层数的树，即，如果一个节点属于特定“层”，则它应该与其他节点属于同一区域。层。

我尝试在下图中解释更多内容，但有人对此有什么建议吗？

d3

内部是否有任何预定的算法可以做到这一点，或者可以通过调整来实现这一点？

Answer 1

您的图表看起来与此示例几乎相同，它使用基于深度的自定义重力。还有另一个示例，使用自定义力来吸引父节点。这些都来自我关于强制布局的演讲。

当然，强制布局只是一种选择，正如 @nrabinowitz 所说，还有更多的层次结构。您可以在我的 SVG Open 演讲中找到 more interactive hierarchy examples。

Answer 2

mbostock提到的例子在这里：https://mbostock.github.io/d3/talk/20110921/#20 您可以检查 HTML 以查看 Javascript 代码。