Question

什么是更新已经绘制的节点样式的最简单方法？在这种情况下，创建布局，所有链接，节点 - 完美。然后将数组传递给指令，如果节点名称在该数组中，我想更改其颜色。

示例：

var names = ["tom","john"]; // this data comes in...


                d3.select("node").select("circle").style("fill", function (d) {
                   // I check if the node name is in array, if so change its colour to green.
                    if (names.indexOf(d.name) > -1) {
                        return "green";
                    } else
                        return "red";

                });

Answer 1

尝试使用选择filter

d3.selectAll("node").selectAll("circle")
  .filter(function(d){
    return names.indexOf(d.name) < 0;
  })
  .style("fill", "red");

Answer 2

ahmohamed的方法很好。另一种选择：当您构建页面时，请为每个节点添加名称id或附加class。然后，您可以使用该ID或类选择所需的元素，也许使用复合CSS选择器。例如，如果您创建名称id，则可以执行以下操作：

d3.selectAll("node").selectAll("#tom").style("fill", "green");

这里＆＃34; #tom＆＃34;指的是id="tom"的所有DOM元素。如果除了圈子之外还有其他东西＆＃34; tom＆＃34;作为id，这应该有效：

d3.selectAll("node").selectAll("circle#tom").style("fill", "green");

用circle获取id="tom"。

（有可能将#tom和#john与选择器中的某种OR运算符结合使用。我不确定。）

在d3js强制布局中更新某些节点的样式

2 个答案: