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

You can check whether the current node has any children and add a title only if it doesn't. The code would be

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

Note that you could similarly set a g.leaf.node class so that you could operate on all the leaves easier if you have several things that are specific to them.