D3.js D3 force layout：如何通过数据的ID索引数据，而不是在“索引”中索引数据；节点“；排列

我在玩D3Force布局。在force layout中，必须给出“链接”和“节点”才能生成force图。D3将链接的“源”和“目标”解释为“节点”数组中节点的索引。我的问题是：如何通过“节点”属性中的ID而不是“节点”数组中的索引来索引数据？ 这是我的Json文件：

{
    "nodes":
    [
        {"name": "A", "ID": 10},
        {"name": "B", "ID": 20},
        {"name": "C", "ID": 30},
        {"name": "D", "ID": 40}
    ],
    "links":
    [
        {"source": 10, "target": 20},
        {"source": 20, "target": 30},
        {"source": 30, "target": 40}
    ]
}

我知道这里有人问：

但解决办法不是我想要的。因为最近我看到一些人只是通过传递一个简单的键函数来进行特殊索引：

问题是我不理解“#{d.source.id}#{d.target.id}”的含义

有人想解释一下吗

嗯。以上是用coffescript编写的。当我尝试将其转换为常规D3 javascript时，以下内容无法工作：

 node = nodesG.selectAll("circle.node")
        .data(curNodesData,function(d) {return d.ID;})


    link = linksG.selectAll("line.link")
        .data(curLinksData, function(d) {return "#{d.source.id}_#{d.target.id}";})

无法按预期工作：

link = linksG.selectAll("line.link")
            .data(curLinksData, function(d) {return d.source.id+"_"+d.target.id;})

谢谢

---

Derek

此部分将创建一个唯一的id，以便在将数据绑定到DOM对象时使用

(d) -> "#{d.source.id}_#{d.target.id}

我认为这个代码在没有lambda表达式的情况下是等价的-

node = nodesG.selectAll("circle.node")
    .data(curNodesData, function(d) { return d.source.id + _ + d.target.id; });

---

这里发生了两件不同的事情——首先是链接的解析，然后是数据与DOM元素的匹配。如果我没弄错你的问题，你关心的是前者。您可以在代码中用对相应节点对象的引用替换链接中节点的ID——这是D3在内部指定ID时所做的操作。这允许您以任何方式解析ID。@Lars Kotthoff，您能再多说一点吗“将链接中的节点ID替换为对相应节点对象的引用"? 你能用我的例子说明一下吗？谢谢。这就是你链接到的答案中所做的——不是输入节点的编号，而是输入实际节点本身。@Lars Kotthoff，现在我可以理解这部分了。但如何在常规D3JavaScript中实现这一点。请看我的更新。我尝试了{return d.source.id+“”+d.target.id；}，可以显示图形，但链接的两端仍然由数组索引而不是id属性索引。您在那里做的是数据匹配，这与解析链接完全不同。在遍历链接并替换节点id之前需要代码，类似于

links.forEach（函数（d）{d.source=findNodeWithId（d.source）；d.target=findNodeWithId（d.target）；}）

，可以显示图形，但链接的两端仍然由数组索引而不是ID属性索引。

node = nodesG.selectAll("circle.node")
    .data(curNodesData, function(d) { return d.source.id + _ + d.target.id; });