1

D3.js を数週間学習しています。戻ってコードの一部をクリーンアップし、もう少し効率的にします。ペアの棒グラフがあり、マウスオーバーでツールチップが生成されます。ツールチップのタイトルは、特定のバーの色と一致します。

ツールチップ ホバー

これが望ましい効果です。ただし、カラー配列から静的に色を設定しています。

d3.select("#tooltip")
        .select("#keyword")
        .style("color", colors[0][2])
        .text(d.keyword);

現在のバーの色を選択して、マウスオーバーのツールチップに適用できると思います。これはどのように設定できますか?(たぶん、Jquery と組み合わせて、$this を使用して選択しています。)

ホバリングしている色を検出してその色を適用するには、JavaScriptを使用したいと思います。だから私は代わりにある種の匿名関数が必要ですcolors[0][2]

完全なコードで遊ぶためにFiddle を作成しました。

4

1 に答える 1

4

どうぞ:

http://jsfiddle.net/VTJ5G/

関連するコードを 2 か所で次のように変更しました。

d3.select("#tooltip")
    .select("#keyword")
    .style("color", d3.select(this).style("fill"))
    .text(d.keyword);
于 2013-04-30T17:03:02.837 に答える