2013-10-08 14 views
5

SVGのテキストの周囲に長方形を配置したいと思います。 テキストの高さはわかっています(text要素のfont-size属性)。しかし、幅は実際のコンテンツに依存します。 getBBox()またはgetComputedTextLength()を使用すると効果があります。しかし、これはレンダリングの後でのみ機能します。レンダリング前にSVGでテキストの幅を取得する

これを別の方法で指定する方法はありますか?例えば、x属性とwidth属性を他の値との相対的な関係で定義していますか?私はSVG仕様でそういうものは見つけられませんでした。

+0

レンダリング後の測定で何が問題になりますか? –

+0

@RobertLongsonコードの複雑さと視覚的なジャンプ。私は文書全体を動的に生成しています。すべてのオブジェクトを準備してから、ドキュメントに追加してレンダリングする必要があります。レンダリング後に計算するときは、未完成のオブジェクトをレンダリングしてから、レンダリング後に変更する必要があります。これは視覚的なジャンプにつながるでしょう。 – radlan

+0

質問にあなたのコードを追加しますか?ドキュメントにまだ挿入されていない要素のbboxとテキストの長さを取得しようとしていますか? –

答えて

0

文字の終わりは、フォントとスタイルなどに基づいて各文字の幅を調べることで、レンダリング自体が実装するのとほぼ同じ基本的なコードパスを必要とすると思われる。私が気付いていないように、そのようなメソッドが現れたり、他の人によってここに報告されるまで、実際のレンダリングを行わずにこの情報を直接取得する方法は、実際のレンダリングを行う前に目に見えないようにレンダリングしなければなりません。

これは、実験で最も効果的な隠れたレイヤー(Z-インデックス、不透明度など)または表示可能なビューポートの外側で行うことができます。ブラウザでレンダリングして調べる必要があります。そのために目に見えない形でレンダリングしてください。getComputedTextLength()

関連する問題