D3.js力定向图搜索

Question

我正在尝试在 d3 力定向图示例上实现搜索函数。当我在文本字段中输入搜索查询时，将显示相关项目，而不相关的项目将淡出。

我已经实现了方法搜索更新和计数，如下面的jsfiddle所示。

我需要一些帮助来淡化项目。目前d3.select("svg")淡化整个图形，而d3.select("#"+n.id)产生错误。

Answer 1

当您d3.select("svg")时，您正在选择SVG画布并设置其opacity。你想做的是

    d3.selectAll("circle") 

或

   d3.selectAll("circle.node") 

并在那里应用opacity。

然后你要做的是使用d3.select("#"+n.id)选择与ID匹配的圆圈，但要做到这一点，你必须在创建圆圈时创建一个id，比如

  .attr("id", function(d,i) {return "circle"+i})

否则，您没有可供选择的 ID。