D3：マウスは、私は、グラフ上のツールチップのため<a href="https://github.com/Caged/d3-tip/" rel="nofollow">d3-tip</a>を使用しているツールチップ

Question

上にあるときに、オープンマウスオーバーしてください。そして、ツールチップを短時間開いたままにする簡単な方法があれば、うまくいっていますか？

ノード上でmouseoutになると、.hide()メソッドが起動し、実際にはツールチップにカーソルを置くことはできません。

私はそうのような.show()方法、発火することができますので、私はmouseover tooltip要素への道が必要だと思う：

...

tip.on('mouseover', function(d) { 
    tip.show(d); 
} 

をしかし、私はこれを行う方法がわからないんだけど私はJSFiddle hereを設定しました。

これが可能であれば任意のアイデア？

ありがとうございます！ここで

Answer 1

が結果だ：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); 
    }); 

私はあなたのD3-tipのmouseoverイベントを追加し、そのhideイベントフェードアウトしました。