1

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 ツールチップ ライブラリでも同じ問題が発生します。

4

1 に答える 1