d3 を使用してマップにツールチップを追加しようとしています -- この投稿のアドバイスに基づいて円のマウスオーバーでデータを表示します
ボストックのチュートリアルからこの例を見ています。
私のSVGは次のようになります。
<svg width="503" height="629">
<g class="precincts">
<path class="O precinct" title="52-47" id="1-1" d="8895922,383.750108730128L128.22787341161165,383....403.91773820327217L135.3001918293303,404.0915875970313Z">
</path>
...
<path>
</path>
</g>
</svg>
SVG をロードする呼び出しの後に呼び出されるドキュメント ロード関数にこの jquery があります。
$('.button').tipsy({
gravity: 'w',
title: function() {
return 'Hi there!';
}
});
$('.precinct').tipsy({
gravity: 'w',
title: function() {
alert("here");
return 'Hi there!';
}
});
.button セレクターがツールチップを起動するため、tipy は適切にロードされます (コンソール エラーも発生しません)。また、css ルール .precinct{style} を記述できるため、「.precinct」セレクターは正しいです。それで、私は何が欠けていますか?クラス ボタンのすべてを選択してツール ヒントを追加するのと同じように、クラス プレシンクトのすべてを選択してツール ヒントを追加する必要があります。右?
simpletip ツールチップ ライブラリでも同じ問題が発生します。