d3網絡（圖形）可視化 - 點擊刪除節點（+鏈接）

Question

我一直在試圖調整以下代碼： https://bl.ocks.org/mbostock/4062045 以這種方式可以刪除節點+單擊。

我試過到目前爲止被加入以下代碼：

.on("click",function() { 
      d3.select(this).remove(); 
      restart(); 
      }) 

，從這裏這個片段：https://bl.ocks.org/mbostock/1095795

function restart() { 

    // Apply the general update pattern to the nodes. 
    node = node.data(nodes, function(d) { return d.id;}); 
    node.exit().remove(); 
    node = node.enter().append("circle").attr("fill", function(d) { return color(d.id); }).attr("r", 8).merge(node); 

    // Apply the general update pattern to the links. 
    link = link.data(links, function(d) { return d.source.id + "-" + d.target.id; }); 
    link.exit().remove(); 
    link = link.enter().append("line").merge(link); 

    // Update and restart the simulation. 
    simulation.nodes(nodes); 
    simulation.force("link").links(links); 
    simulation.alpha(1).restart(); 
} 

如果我第一個指定的節點和鏈接方式如下：

var nodes = [{id: "Simplice"},{id: "Valjean"}] 
    var links = [{"source": "Simplice", "target": "Valjean", "value": 3}] 

restart（）;刪除除指定的節點和鏈接之外的所有節點和鏈接 - 我試圖達到相反的目的。因此，我可以刪除除指定的元素之外的所有元素，並且圖形很好地重繪，但我無法將其刪除選定的節點。

d3.select（this）.remove（）;刪除節點但不刪除鏈接，不重繪圖形。

我的想法是：1.將json數據存儲在「nodes」變量中。 2.通過鼠標單擊從「節點」變量中刪除元素及其鏈接。

然後該圖應該很好地重繪自己。任何想法如何做到這一點？

Answer 1

而不是與d3.select(this).remove()修改文檔，則需要修改數據本身（即nodes和links代替node和link）。我認爲這基本上是你在問題結尾處描述的內容。

例如，嘗試這樣的事情：

.on("click", function(d){ 
    nodes = nodes.filter(function(n){ return n.id !== d.id; }); 
    links = links.filter(function(e){ 
     return e.source.id !== d.id && e.target.id !== d.id; 
    }); 
    restart(); 
});