D3.js 使用D3 force layout中的数据(…)更新图形

D3.js 使用D3 force layout中的数据(…)更新图形,d3.js,force-layout,D3.js,Force Layout,我正在使用D3 force布局并添加代码以允许用户在此处选择单个节点,select与D3 select无关,但从用户的角度指示节点的突出显示状态。一次只能选择一个节点。因此,当用户单击未选择的节点时,我想取消选择任何选定的节点 我正在节点上使用一个属性,selected,并努力使用D3数据设置它。。。或数据。。。方法事实上,我不能让它像那样工作。我现在所拥有的似乎有点笨拙,所以我希望有一个更干净的方法 function deselectAll() { var sc = d3.select

我正在使用D3 force布局并添加代码以允许用户在此处选择单个节点,select与D3 select无关,但从用户的角度指示节点的突出显示状态。一次只能选择一个节点。因此,当用户单击未选择的节点时,我想取消选择任何选定的节点

我正在节点上使用一个属性,selected,并努力使用D3数据设置它。。。或数据。。。方法事实上,我不能让它像那样工作。我现在所拥有的似乎有点笨拙,所以我希望有一个更干净的方法

function deselectAll() {
    var sc = d3.selectAll("circle")
        .filter(function(d) {return (d.selected == "y")});

    var circles = sc.data();

    sc.transition()
        .duration(50)
        .style("stroke-width", "1px")
        .style("stroke", "#3182bd");

    if(null != circles && circles.length > 0) {
        for(i=0; i<circles.length; i++) {
            circles[i].selected = "n";
        }
    }
}

问题是将.datan添加到链中不会将“selected”设置为n。作为d3链的一部分,可以这样做吗?

d3中的许多选择或转换函数将当前数据从每个节点传递到您定义的函数。您可以随时修改此基准的内容

使用您的示例,如果要将d.selected==y的节点从y设置为n,则可以使用过滤后的选择,如下所示:

sc.each(function(d) {
    d.selected = "n";
});

此函数将为选择中的每个节点调用一次,每个节点根据您的过滤器选择y,因此您可以简单地更改基准上的属性值。

是的,这很好。我没有看到这个功能。谢谢