Javascript D3.js使用强制定向布局和节点矩形的网络图

我试图修改Mike的示例，使用矩形而不是圆形作为节点。另外，我希望矩形内有文本

我有正确显示文本的矩形，但是它们没有连接到链接，并且不会移动

这里有一个代码笔链接：

---

更新

多亏了他的评论，现在一切都好了

我对代码所做的更新：

添加由Lars说明的变换

将链接更改为在矩形中心连接

为矩形添加圆角

给文本留了一点空白缩进

更改为使用窗口宽度/高度

这是我的新密码笔：

---

您正在设置

g

元素上的

x

和

y

属性来更改它们的位置——这不会起任何作用。您需要设置

transform

属性，就像您在添加

g

元素时所做的那样。因此，

勾选

处理程序函数将包含

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

而不是

node.attr("x", function(d) {
        return d.x;
    })
    .attr("y", function(d) {
        return d.y;
    });

---

完成演示。

您需要像在附加矩形时那样设置

变换

属性：完成了。如果你把这个作为回答，我会接受的。谢谢

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

node.attr("x", function(d) {
        return d.x;
    })
    .attr("y", function(d) {
        return d.y;
    });