Question

我正在尝试向动态创建的节点添加文本，特别是，如下图所示： http://bl.ocks.org/mbostock/999346

我不打算将文本添加到可折叠图形，而是将文本添加到在运行时插入节点的图形，如上例所示。

到目前为止，我还有以下附加代码：

node.enter().append("text", "g")
        .attr("x", function(d) { return (d.x);})
        .attr("y", function(d) { return (d.y);})
        .text(function(d) { return d.name; })
        .attr("text-anchor", function(d) { return d.children || d._children ? "end" : "start"; });

这会添加文本，但插入节点时不会移动。

下面的行似乎移动了示例中的节点和链接：

    var t = svg.transition()
            .duration(duration);

    t.selectAll(".link")
            .attr("d", diagonal);

    t.selectAll(".node")
            .attr("cx", function(d) { return d.px = d.x; })
            .attr("cy", function(d) { return d.py = d.y; });

但为文字添加了类似的功能：

 t.selectAll(".text")
        .style("fill-opacity", 1);

无效。

我非常感谢有关此事的任何指导。

Answer 1

节点都标有d3.selectAll('.node')，因此您需要为它们提供节点类。

此外，cx和cy属性不存在于文本元素上。您想要x和y。

示例小提琴是here.

转换D3中的文本

1 个答案: