D3 强制布局更改显示与滑块的链接

Question

我对这个 d3 force 布局有疑问：

http://plnkr.co/edit/UJqNumlkl9rt8WGGOKYm?p=preview

我试图只显示值等于滑块值的 links。但是它只在加载数据时有效，当我滑动滑块时它什么也不做，我不明白为什么。这是更改 link 宽度

的代码

var link = svg.selectAll(".link")
    .data(graph.links)
    .enter().append("line")
    .attr("class", "link")
    .style("stroke-width", function(d) {
        return d.value == slider.value() ? 3 : 0;
    });

有人可以帮我吗？

Answer 1

所以你想要做的就是随着滑块值的变化更新 link。

slider.on('slide', function(e,v) {
  updateLinks();
});

function updateLinks(){
  svg.selectAll(".link")
   .style("stroke-width", function(d) { 
     return d.value==slider.value() ? 3:0; 
  });
}

Here 是有解决方案的 plunker

D3 强制布局更改显示与滑块的链接

D3 force layout change showed links with slider

javascript

d3.js

force-layout