删除 d3 图节点留下剩余的行

Question

我正在编写一个基本的有向图编辑器并从 JSON 加载初始图。

我的问题是删除节点经常会留下剩余的行（通常与我要删除的节点完全无关 - 您可以通过遍历并删除一堆节点来复制它）。其余工件也不随力布局移动。

我的理解是link.exit().remove(); 应该删除任何与我当前数据集不匹配的 links:

link = link.data(links,function(d){return d.source.Id + "_" + d.target.Id;});

A link 我的样本：

https://jsfiddle.net/slizice/9a8d6zsm/60/ （点击一个节点并点击 delete/backspace 删除）

直到我开始使用更大的数据集，我才注意到这一点。

如有任何想法，我们将不胜感激！

编辑：

看起来有些重复的 link 可能是罪魁祸首。一旦我有解决方案，我会 post 给出答案。

Answer 1

看起来我生成链接的服务器端代码在某些情况下会多次遍历它们，生成重复项。

为了在客户端处理重复项，我只是先检查数组：

exists = false;
  edges.forEach(function(e) {
    if ((e.source.Id == sourceNode.Id) && (e.target.Id == targetNode.Id)) {
      exists = true;
    }
  });
  if (!exists) {
    edges.push({
      source: sourceNode,
      target: targetNode,
      value: e.Value
    });
  }

删除 d3 图节点留下剩余的行

Deleting d3 graph nodes leaves lines remaining

javascript

directed-graph

d3.js

force-layout