Javascript d3：在节点旁边添加标签

我正在尝试在force布局图中的每个节点旁边添加标签。但是，所有标签都显示在我的屏幕的左上方。我看了很多其他类似问题的stackoverflow问题，我自信地说我尝试了不同的解决方案，但我似乎仍然有这个问题。在下图中，您可以看到所有标签堆叠在一起

以下是我如何初始化节点、节点图像和文本：

 var node = svg.selectAll(".node")
      .data(nodes)
        .enter().append("g")
      .attr("class", "node")
    //.attr("transform", function(d){return "translate("+d.x+","+d.y+")"})
      .call(force.drag);

  node.append("image")
      .attr("xlink:href", "../icons/workstation.png")
      .attr("x", -25)
      .attr("y", -25)
      .attr("width", 50)
      .attr("height", 50);

  var text = node.append("text")
        .attr("dx", ".35em")
        .attr("dy", ".35em")
        .text(function(d){ return d.ip});

我尝试了许多不同的x&y和/或dx&dy值，但结果是一样的。 下面是我的按记号更新图表的方法：

 force.on("tick", function() {


    link.attr("x1", function(d) { 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.attr("cx", function(d) { return d.x; })
        .attr("cy", function(d) { return d.y; });

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

});

---

你能做一个提琴或弹拨器，这样我们就可以处理它并得到它了。在你的tick函数中，去掉这一行

node.attr（“cx”，函数（d）{return d.x；}）。attr（“cy”，函数（d）{return d.y；}）因为您已经在执行transfrom@saikiran.vsk出于某种原因，我创建的JSFIDLE似乎不起作用。这是链接，所有代码都在里面。这是我的第一次尝试，所以我想我错过了什么？我正在插入D3作为一个框架，但是我看不到插入Cola.js的选项。你在寻找你到底改变了什么？在我看来是一样的，我在一个脚本比较工具上运行了它-它是一样的：）