Javascript 在d3.js tick事件中更改svg路径元素的填充/笔划不会产生任何效果

我正在尝试学习更多的d3.js并使用这个例子。特别是，我试图通过向

tick

事件添加代码来更改连接节点的边的颜色。我已将

tick（）

修改为以下内容：

// update force layout (called automatically each iteration)
function tick() {
  // draw directed edges with proper padding from node centers
  path.attr('d', function(d) {
    var deltaX = d.target.x - d.source.x,
        deltaY = d.target.y - d.source.y,
        dist = Math.sqrt(deltaX * deltaX + deltaY * deltaY),
        normX = deltaX / dist,
        normY = deltaY / dist,
        sourcePadding = d.left ? 17 : 12,
        targetPadding = d.right ? 17 : 12,
        sourceX = d.source.x + (sourcePadding * normX),
        sourceY = d.source.y + (sourcePadding * normY),
        targetX = d.target.x - (targetPadding * normX),
        targetY = d.target.y - (targetPadding * normY);
    return 'M' + sourceX + ',' + sourceY + 'L' + targetX + ',' + targetY;
  });

  /**** this is the beginning of my modification ****/
    path.attr('fill', function(d){
        return d.left ? 'red':'blue'
});

    path.attr('stroke', function(d){
        return d.left ? 'red':'blue'
});    
  /**** this is the end of my modification ****/   

  circle.attr('transform', function(d) {
    return 'translate(' + d.x + ',' + d.y + ')';
  });
}

但是，所有边仍为黑色。我在代码中使用了ctrl-f键，但这两个属性都不是为路径设置的，所以我想知道为什么我看不到任何效果。看起来

svg:path

实际上具有

stroke

和

fill

属性（）

如果我放置一个

console.log（d.target.id）命令在我添加的两个属性分配函数中，控制台输出是合理的。最后，如果我将“红色”和“蓝色”替换为
d3.rgb（colors（5））
或类似的值，这也没有效果，因此我认为问题不在于颜色值

为什么我的代码不影响svg元素？
路径（在应用函数后）如下所示

<path class="link" fill="blue" stroke="blue" ... />

CSS类的属性比填充和笔划属性更高，所以这就是它的用途

如果您想应用填充和笔划属性颜色，可以从path.link CSS中删除填充和笔划线。
非常感谢您指出我应该已经检查的内容！（啊）非常感谢。
path.link {
  fill: none;
  stroke: #000;
  stroke-width: 4px;
  cursor: default;
}