D3.js突出的節點選擇鏈接

Question

所以第一，我有數據格式下同 https://bl.ocks.org/mbostock/4062045

miserables.json我希望能夠使連接到我的節點紅色的鏈接時，我點擊節點。 所以psuedo⁻code會像

selectAll(.links) 
if links.source=nodeID or links.target=nodeID 
then links.color=red 

但我沒有能夠做到這一點。我的最終目標是將它與Arc圖表結合起來使用 http://bl.ocks.org/sjengle/5431779

Answer 1

您的僞代碼是一個好的開始。您可以使用filter來實現選擇中的if條件。需要注意的是.source和鏈接.target由D3編輯，他們不再是節點的ID，但該節點本身：

thisNode = nodeObject; // where nodeObject is the javascript object for the node, it's probably called "d" in your function. 
d3.selectAll(".link") 
    .filter(function(d) { 
    return (d.source === thisNode) || (d.target === thisNode); 
    }) 
    .style("stroke", "red") 

Answer 2

擴大對@ Laurent的回答之上，「重啓」的鏈接顏色可能在之前的互動中被塗成紅色：

thisNode = nodeObject; // where nodeObject is the javascript object for the node, it's probably called "d" in your function. 
d3.selectAll(".link") 
    .style("stroke",function(d) { 
    return d.source === thisNode || d.target === thisNode ? "red" : "#888888"; 
    })