为什么我在更新 d3.js 强制布局时必须重新分配链接和节点答案

【问题标题】：Why do I have to re-assign the links and nodes when updating the d3.js force layout为什么我在更新 d3.js 强制布局时必须重新分配链接和节点
【发布时间】：2016-01-18 09:58:49
【问题描述】：

在this example，每个人都带我去的地方，代码编写者在start() 方法中重新分配了变量link 和node。我真的不明白为什么。由于两个片段是相同的，我将专注于一个：

link = link.data(force.links(), function(d) { return d.source.id + "-" + d.target.id; });
link.enter().insert("line", ".node").attr("class", "link");
link.exit().remove();

Q 1：link 已经指定为 var link = svg.selectAll(".link");，这意味着 link 包含 svg 容器中的所有 DOM 元素，分类为 .link。此选择在示例开始时可能为空，但他为什么将其重新分配给部队中的所有链接？

问题 2：他为什么返回 @987654331 @ 和 d.target.id 属性？是否有必要识别链接？

问题 3：其他操作（例如为链接添加颜色）会这样完成吗？

link.enter().insert("line", ".node").attr("class", "link").style("stroke", function(d) { 
    return d.color;
});

【问题讨论】：

标签： javascript d3.js svg

【解决方案1】：

问题 1：

就像你最初说的那样它是空的var link = svg.selectAll(".link"); 但是当数据进入start 函数时，这个变量会保存所有当前的链接。

问题 2

Q 2：他为什么返回 d.source.id 和 d.target.id 属性？这是否需要识别链接？

link.data(force.links(), function(d) { return d.source.id + "-" + d.target.id; });

这样做是为了唯一标识一个链接。该函数返回链接的唯一 ID，它是源 ID 和目标 ID 的组合。需要这样退出函数才能在交集后知道需要删除哪个链接。

问题 3

Q 3：其他操作（例如为链接添加颜色）会这样完成吗？

link.enter().insert("line", ".node").attr("class", "link").style("stroke", function(d) { 
    return d.color;
});

是的！如果链接数据中有可变颜色。像这样{source: a, target: b, color:"red"} 代码here

希望这会有所帮助！

【讨论】：