D3 可折叠力布局可变链接长度答案

【问题标题】：D3 Collapsible Force Layout Variable Link LengthD3 可折叠力布局可变链接长度
【发布时间】：2016-10-08 00:10:49
【问题描述】：

我一直在尝试调整下面链接中显示的可折叠力布局。 http://bl.ocks.org/mbostock/1093130

谁能帮助我了解如何将每个链接的链接距离设置为不同的长度，而不是将它们都设置为一个值？

与此问题类似的是示例https://bl.ocks.org/mbostock/1062288，它似乎允许各个链接具有不同的长度。但是，我不明白代码是如何解释这一点的。

感谢任何指导。

【问题讨论】：

您可以使用帮助链接距离来做到这一点。请查看此stackoverflow.com/questions/32882284/…
感谢西里尔，这帮了大忙。对于可能读到这篇文章的其他人来说，我意识到在定义链接距离时我必须指定我指的是“目标”，这也很重要。

标签： javascript d3.js

【解决方案1】：

正如 Cyril 所说，下面的代码很有用。

var force = d3.layout.force()
.linkDistance(function(d){
    if(d.target._children){
        return 50;//target is not expanded so link distance is 50
    } else {
        return 200;//target is expanded so link distance is 200
    }
})

这对我有什么影响：

var force = d3.layout.force()
.linkDistance(d.target.nodeproperty)

特别是我没有意识到我必须在 d.nodeproperty 中指定目标。

【讨论】：