score:3

Accepted answer

here's the result: http://jsfiddle.net/hx8pjwdu/9/

     .on('mouseover', function(d) {     
       d3.select(".d3-tip").transition().style("opacity", "1");
       tip.show(d);
     })
     .on('mouseout', function(d) {
       d3.select(".d3-tip").transition().duration(1000).style("opacity", "0").each("end", tip.hide);
     });
  d3.select(".d3-tip").on('mouseover', function(d) {
       d3.select(".d3-tip").transition().style("opacity", "1");
     }).on('mouseout', function(d) {
       d3.select(".d3-tip").transition().duration(1000).style("opacity", "0").each("end", tip.hide);
     });

i added a mouseover event for your d3-tip and made its hide event a fadeout.


Related Query

More Query from same tag