2011-08-16 19 views
5

キャンバスにテキストを描画する必要がありますが、現在のfillTextの実装では、複数の線を描くことができるなど、多くの機能が必要以上に複雑になります。キャンバスにテキストを描画する

ピクセルをキャンバスから後でコピーする必要があるため、キャンバスに描画する必要があります。キャンバス上にはspanの要素を使用できません。

編集可能にすることはプラスですが、必須ではありません。

キャンバスにテキストを描画するための高度な機能を提供するライブラリはありますか?

+0

[Fabric.js](http://kangax.github.com/fabric.js/demos/kitchensink/)は、複数行をサポートしていると言うことができますテキスト、およびさまざまなテキストオプション(イタリック、アンダーライン、ストロークスルー、シャドウ) – kangax

答えて

2

http://www.canvastext.com/

を(これはIE9、FirefoxやChromeとOperaの上に少なくとも働かなければならない)、この情報がお役に立てば幸いです。

+0

完璧!ありがとうございました! –

0

私はFLOT Canvas Text plugin for jqueryの知っているだけです。

しかし、もし私があなただったら、私は<span>でそれをやっています。それは検索エンジンにやさしいからです。オブジェクトに応じて、element.innerHTMLまたはelement.innerTextを使用して、スパン(またはほとんどの)要素のテキストを簡単に取得できます。あなたはそれを処理/渡すことができます。例えばこのよう

<span id="myspan"> lorem ipsum </span> 

としてスパンのために私は

spanText = document.getElementById("myspan").innerText; 
+0

私はそれを見てみるつもりです。 については、キャンバスが画像サービスにアップロードされるため、キャンバスにレンダリングする必要があります。 –

+0

プラグインがあります:HTMLtoCanvas(http://html2canvas.hertzen.com/)。あなたはそれをDOMに渡し、それを解析し、javascriptだけを使ってローカルにキャンバススナップショットを作成します。キャンバスからスクリーンショットを送信することはできますが、私にとっては、最初からすべてをサーバーサイドで行う方が理にかなっています – mrBorna

関連する問題