0

I've written a D3 method that changes the text in a tag (a tooltip of sorts). This happens when I click a node in a force-directed graph. However, when I doubleclick I would like to hide certain nodes. Without the tooltip this works just fine, but when I include the code to change the tooltip, the doubleclick doesn't seem to work. Any help would be greatly appreciated.

function tooltip(d) {
  console.log("Clickvar: " + clickvar);
  if (clickvar == false) {
    div.transition()
      .duration(300)
      .style("opacity", .9);
    div.html("<p>Top-tag: \n" + d.tag + "</p><p>Contacts: "+ d.contacts + "</p>")
      .style("left", d3.event.pageX + "px")
      .style("top", d3.event.pageY + "px");
    clickvar = true;
  }
  else {
    div.transition()
      .duration(100)
      .style("opacity", 0);
    clickvar = false;
  }
}
Sebastian Stoelen
  • 97
  • 1
  • 11
  • How you are binding click event ..... need to see a little more code. – saikiran.vsk Jul 22 '15 at 08:44
  • `node.enter.append().on("click", function(d) {return tooltip(d)});` The thing is the code works just fine when I delete the `div.html(...)` from the code snippet above. – Sebastian Stoelen Jul 22 '15 at 10:02
  • Ok, for double click try like this, node.enter.append().on('dblclick', function(d){ return tooltip(d);}); or you can add event to the above line node.enter.append().on('click', function(d){......})).on('dblclick', function(d){ //do what you want here}); – saikiran.vsk Jul 22 '15 at 10:32

0 Answers0