更改d3.js节点的填充颜色

Change fill color of d3.js node

本文关键字:填充 颜色 节点 d3 js 更改      更新时间:2023-09-26

我正在这里完成示例代码-http://bl.ocks.org/cjrd/6863459创建一个有向图并在线播放。该代码已经有一个称为的功能

GraphCreator.prototype.changeTextOfNode

此函数将可编辑文本放置在节点上,以便用户可以更改值,当用户在按下shift键的同时单击节点时会调用此函数。现在,我想做一些非常相似的事情。我希望在按住Ctrl键的同时单击节点时更改节点的颜色。为此,我想到的功能是-

GraphCreator.prototype.changeColorOfNode = function(d3node, d){
  try{
      d3node.style("fill","red");
    }
    catch(e){
      alert(e.message);
    }
}

现在,我总是把颜色改成红色,只是为了检查一下效果。我看到的是,代表节点的圆圈的填充颜色没有改变,圆圈中文本的字体颜色变成了红色。有人知道我将如何改变填充颜色吗?

当前您正在将填充样式应用于g元素,而不是圆形。这就是为什么只有文本的颜色会改变。您应该按照如下所示进行尝试。

d3node.select("circle").style("fill","red");

查找节点的现有颜色

d3node.select("circle").style("fill"); //returns current fill color applied