2

也许这是一个愚蠢的问题，但我是 d3 新手。我正在尝试根据源链接权重更改力布局中圆的半径。为什么 d.source.weight 可以在 tick 函数中访问，但不能在其他任何地方访问？

例如

force.on("tick", function() {
    link.attr("x1", function(d) {console.log(d.source.name + " " + d.source.weight; return d.source.x; })
        .attr("y1", function(d) { return d.source.y; })
        .attr("x2", function(d) { return d.target.x; })
        .attr("y2", function(d) { return d.target.y; });

将正确的值返回到控制台，但是为什么在附加圆圈时无法访问这些属性？

node.append("circle")
     .attr("class", "node")
     .attr("r", function(d) {return d.source.weight * 2;});  // breaks

我觉得这更像是一个基本的 javascript 问题而不是 d3 问题，但我找不到太多帮助。任何帮助表示赞赏。

4

2 回答 2

1

tick 功能不会改变您设置时发生的情况.attr("r", ect )；你正在改变你的设置：

关联

link.attr("x1", function(d) {console.log(d.source.name + " " + d.source.weight; return d.source.x; })

节点

  node.append("circle")
 .attr("class", "node")
 .attr("r", function(d) {return d.source.weight * 2;});  // breaks

我猜你正在处理这个例子。您可以通过在引用API时通读源代码的第 38-69 行来了解 node 的不同之处。不过，这可能很棘手，而且有点困难。我建议打开带有示例的控制台并稍微玩一下以更好地了解正在发生的事情。

我建议尝试其中一些命令（使用 chrome，以便您还可以轻松检查对象并查看连接到节点和链接的数据具有哪些属性）：

node.attr("r", function(d){ return 8; })
node.attr("r", function(d){ return d.weight; })

link.attr("class", "")
link.attr("stroke", "yellow")
于 2013-06-13T01:25:28.600 回答
1 
node.append("circle")
     .attr("class", "node")
     .attr("r", function(d) {return d.weight * 2;});  // breaks

在这种情况下，只需删除“.source”您正在使用的节点 function(d){...} 而不是链接。

于 2014-01-15T07:15:07.940 回答