Question

实际上我已经在有界力导向图中集成了可折叠特征。但是当我试图在每个节点上放置一个标签时，我得到了意想不到的输出。

我使用下面的代码在节点上附加标签：

  node.enter().append("text")
            .attr("class","node")
            .attr("cx", function(d) { return d.x; })
            .attr("cy", function(d) { return d.y; })
            .on("click",click)
            .text(function(d){return d.name})
            .call(force.drag);

以下代码我写了一个tick函数：

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

我可能做错了什么？

Answer 1

我需要附加g标签然后圈出文字：

  var nodeEnter = node.enter().append("g")
      .attr("class", "node")
      .on("click", click)
      .call(force.drag);

  nodeEnter.append("circle")
      .attr("r", function(d) { return Math.sqrt(d.size) / 10 || 8.5; });

  nodeEnter.append("text")
      .attr("dy", ".35em")
      .text(function(d) { return d.name; });

  node.select("circle")
      .style("fill", color);

d3.js强制可折叠标签

1 个答案: