3

私はd3を使用して、複数のパスを持つグラフを作成しています。左側にパスの説明を表示しています。データと説明は動的であるため、凡例のサイズも当然動的です。テキストのサイズを知っている限り、それは大したことではないためです（ドメイン/範囲のわずかな調整）。問題は、Firefoxブラウザでテキスト要素のサイズを見つける簡単な方法が見当たらないことです。

以前はjqueryでそれを行っていまし.width()たが、要素のclientWidthがゼロであるため、NaNpxが返されるようです。

...
.on("click", function(){
    alert( $(this).width() ); // NaNpx
})
...

デモ：単語をクリックします。

4

2 に答える 2

5

この質問を書いている間、私は解決策を見つけました（しかし、コード例の奥深くでそれを見つける前に非常に長い時間をかけて検索したので、それでも投稿するつもりです）。今月はd3とsvgを初めて使用するためかもしれませんがgetBBox()、テキスト要素（ほとんどの要素）に幅/高さ/ x / yのオブジェクトを生成するメソッドがあります（実際には、代わりに使用する必要があります）すべてのsvgディメンションのjquery）。

これを投稿することで、私にはあまり目立たないように見えたため、この問題に遭遇した他の人の助けになることを願っています。

デモ

また、この例で~~は、はフリップビット演算子であり、2回は実際にはMath.floor（）のように機能しますが、すべてのブラウザーでより高速になる可能性があります.floor()。

于 2012-09-18T02:49:23.980 に答える
0

同じ問題が発生しました。Firefox（45.0）には、SVG内の<text>要素の幅が常に0であるというバグがあるようです。

<tspan>要素（<text>要素内）を使用してバグを克服しましたが、<tspan>のテキストの幅は正しいようです。

それが役に立てば幸い。

于 2016-03-09T23:16:11.227 に答える