Trying to access the parent of a node in d3 tree layout my code looks like this

Here is the function supposed to display the parent name which it accepts as parameter

function draw(a){
  console.log(a);

  }

Here is the function that calls it in the node's mouseover event, see the last line

node.append("circle")
    .attr("class", function (d) {
        var value; 
        if(d.depth == 1){value = "marker";}
        else{value = "else";}
        return value;}
    )
    .attr("r", function(d){return d.depth == 1?d.children.length:3})
    .style("fill", function (d) {
        return d.depth>1?colors(d.parent.name):colors(d.name);})
    .style("stroke", "none")
   .on("mouseover", "draw(function(d){return d.parent.name;})");

However instead I get the error above. Any takers?

Trying to access the parent of a node in d3 tree layout my code looks like this

Here is the function supposed to display the parent name which it accepts as parameter

function draw(a){
  console.log(a);

  }

Here is the function that calls it in the node's mouseover event, see the last line

node.append("circle")
    .attr("class", function (d) {
        var value; 
        if(d.depth == 1){value = "marker";}
        else{value = "else";}
        return value;}
    )
    .attr("r", function(d){return d.depth == 1?d.children.length:3})
    .style("fill", function (d) {
        return d.depth>1?colors(d.parent.name):colors(d.name);})
    .style("stroke", "none")
   .on("mouseover", "draw(function(d){return d.parent.name;})");

However instead I get the error above. Any takers?

• javascript
• d3.js

• 1 Quotes?? .on("mouseover", "draw(function(d){return d.parent.name;})");??? – Tushar Commented Nov 8, 2015 at 10:16
• Didn't get why are you writing a function in side the draw(function(d){return d.parent.name;}) is there a good reason for this... – Cyril Cherian Commented Nov 8, 2015 at 10:23
• Sorry, not sure how you mean. So far in d3 its how I am able to access the current element, see first bracket where I set the circle class attribute – user2964988 Commented Nov 8, 2015 at 10:54

2 Answers 2

It looks like an issue with your "mouseover" handler. You are passing a string instead of a function, which works only in the onmouseover DOM element attribute (and even there it's bad practice with confusing behavior). Try instead

on("mouseover", function (d) {
    draw(d.parent.name);
});

You'll want to do something like this:

.on("mouseover", function(d) {
    draw(d.parent.name);
});