3

キャンバスを使用していくつかの画像を作成しています。キャンバス上の指定された rect (つまり、オフセット x、オフセット y、幅、高さ) でテキストを描画できるようにしたいと考えています。そのテキストは、オーバーフローすることなく、可能であればワード ラップを使用して、できるだけ大きくします。出来ますか？

4

1 に答える 1

3

それが可能だ。

  1. ラッピングなし:CanvasRenderingContext2D.measureText()文字列を受け取り、オブジェクト { width: float } を返すメソッドを使用できます。フォントのサイズを使用して計算を行って、高さを調べる必要があります。次に、バイナリ検索の方法でフォントサイズを列挙します。キャンバスに最適なサイズがすぐに見つかります。

  2. 折り返し：文字列の折り返し点を見つけて、幅と高さを自分で計算する必要があります。

しかし、これを行うためのより簡単な方法があります。

hidden(visibility: hidden not display: none) div を作成し、その幅を定義して、テキストを中に入れます。フォントのサイズを列挙し、オーバーフローまたは大きくなりすぎていないかを確認します。

于 2012-05-16T05:42:11.650 に答える