6

D3有向グラフ レイアウトのリンクのマウス オーバー時にツールチップを実装するにはどうすればよいですか? 私はD3力の例を適応させているので、ノードのツールチップの設定は次のようなコードを使用して簡単でした:

    node.append("title")
        .text(function(n) {
            return n.id;
        });

リンクで同様の手法を試しても、マウス オーバー ツール ヒントは表示されませんでした。

    var link = svg.selectAll("line.link")
        .data(json.links)
        .enter().append("line")
        .attr("class", "link")
        .style("stroke-width", function(d) {
            return 4;
        });

link.append("title")
    .text(function(n) {
            return n.info;
        });
4

3 に答える 3

2

あなたが探しているのは、次の2つの答えの組み合わせだと思います。

d3js: _on()_ が現在のデータム オブジェクトを onmouse 関数に送信しない

と

SVG パスを使用して生成された棒グラフにツールチップを追加する

どちらにも、遊ぶことができる jsFiddles があります。

于 2012-11-07T22:31:08.450 に答える
0

上記のようにリンク タイトルを設定すると、マウス オーバー ツールチップが表示されます。マウスをリンクの任意の部分に数秒間ホバーさせた場合に限ります。

于 2012-11-03T18:09:45.630 に答える