javascript - D3 tree layout add 'title' to leaf nodes only

Question

I can add a title to all the nodes in the tree with

node.append("svg:title").text(function(d) { return d.name + " " + d.size }); 

How can I add the title only to the the leaf nodes?

I tried:

node.selectAll('g.leaf.node text').text("title", function(d) { return d.name + " " + d.size }); 

but this didn't work.

example with titles on all nodes

http://jsfiddle.net/chrisloughnane/EcU2c/

Answer 1

您可以检查当前节点是否有任何子节点，只有在没有子节点时才添加标题。代码是

node.append("svg:title").text(function(d) {
    return d.children ? "" : d.name + " " + d.size;
});

请注意，您可以类似地设置一个g.leaf.node类，以便如果您有几个特定于它们的东西，您可以更轻松地对所有叶子进行操作。