HTMLキャンバス要素にテキストを描画する最も良い方法は何ですか？

Question

残念ながらcanvas要素はテキストをうまく処理しません。多くのアプローチがあります（たとえばhttp://canvaspaint.org/blog/2006/12/rendering-text/を参照）が、ほとんどがハッキングのようです。私はクロスプラットフォームで何をすることができ、自分のフォントを好きなように変えることができますか？

Answer 1

あなたはtypeface.js、http://typeface.neocracy.orgを見ましたか？私はそれがテキストを書くためにかなり固いと聞いています。

"typeface.jsは、HTML文書にテキストを描画するためのブラウザの描画機能を使用しています。ブラウザはベクター描画をサポートしています。Firefox、Safari、およびOperaは<canvas>要素をサポートしています。 （SVGだけでなく）、IEはVMLをサポートしています。

typeface.jsプロジェクトには、フォントを変換するためのperlモジュールとブラウザで描画するためのjavascriptライブラリという2つのコンポーネントがあります。 TrueTypeフォントを作成し、そのデータをJSON形式で書き込みます.JavaScriptライブラリはHTMLドキュメントを横断し、<canvas>またはVMLを使用してグリフを描画します。

<canvas>をサポートするブラウザでは、テキストは選択可能ですが、信念を持たなければなりません。あなたが選択したとき、それはあなたがそれが働いていることを知らせるための強調表示はありません。今後の課題は、ハイライト表示して、テキストを選択するためのより良い、クロスブラウザのサポートを実装することを目指す「（http://typeface.neocracy.org/usage.htmlからの引用を）

Answer 2

を使用すると、HTML5のテキストメソッドを使用する場合は、このライブラリを試してみてください：。http://code.google.com/p/canvas-text/ 私は。主な開発者は、私は助けることができる、と本当にすぐ変更を加える

をデモはここにある！http://canvas-text.googlecode.com/svn/trunk/examples/index.html

それはアルファ段階にまだあるので、任意のバグレポートやフィードバックを歓迎します:)