web-dev-qa-db-ja.com

JavaScript描画ライブラリ?

JavaScriptインタラクティブドローイングライブラリの提案はありますか?線、多角形、異なる色のテキストを描くだけです。 IE/Firefox/Opera/Safari互換。

46
st.

Raphael はそのために非常に優れており、VML(MSIEの場合)とSVG(その他すべての場合)を使用するため、ブラウザー間で機能します。

48
Dan

John Resigの Processing.js は、そのための素晴らしいフレームワークです。

15
Zach

Canvasオブジェクトを直接使用して、2Dで描画できます。 IEにはexcanvasライブラリが必要です。

http://developer.mozilla.org/En/Drawing_Graphics_with_Canvas

7
Craig B.

http://www.walterzorn.de/en/jsgraphics/jsgraphics_e.htm を試してください。これは(SVGを使用せずに)私が見つけた中で最高のものであり、アドインなしのほとんどのブラウザーで動作します。

3
Steve Moyer

Canvasタグでテキストを描画するのは大変です。あなたのオプションは、正しい場所に絶対的に配置された通常のdivを使用するか、フォントレイアウトエンジン( example )を検索/作成するか、またはテキストを描画できる新しい標準が実装されるのを待つことです。 SVGはこれをはるかにうまく処理します。

IEあなたは ExplorerCanvas を使用して、IE独自のVMLマークアップでキャンバスAPIをシミュレートします。ただし、ネイティブVMLは、パスやSVGのようなものでテキストを実行できます。理論的には、複雑なテキスト処理が必要な場合は、Danが述べたRaphaelライブラリのようなSVGとVMLが必要です。

開始する前に、少しの間Flashを検討することもできます。

2
jjrv

また mxGraph 。これはIEにexcanvasを使用しません。 Excanvasは、VMLを使用するよりも速度が遅く、具体的には、削除するのではなく同じVMLノードを再利用して、再描画のためにDOMノードを追加します。これは見過ごされがちな点ですが、IEのexcanvasはひどいです。

2
David

上記のように、キャンバスはあなたが行くべき道です。 IEはネイティブでサポートしていないため、ブラウザ間の互換性を確保するために ExCanvas をダウンロードする必要があります。 Ajaxian canvasタグを使用するプロジェクトの場合。

2
VirtuosiMedia

jQuery Drawingプラグイン を確認してください。また、Mozilla Canvas リファレンスと tutorial も確認できます。

2
CMS

クロスブラウザーの必要性と、出力を行う目的に応じて、Canvas要素と関連するJavaScriptを調べます。

キャンバス

1
Steve g

D3.js

D3.jsは、データに基づいてドキュメントを操作するためのJavaScriptライブラリです。 D3は、HTML、SVG、CSSを使用してデータに命を吹き込むのに役立ちます。 D3はWeb標準に重点を置いているため、独自のフレームワークに縛られることなく、強力な視覚化コンポーネントとDOM操作へのデータ駆動型アプローチを組み合わせることなく、最新のブラウザーのすべての機能を利用できます。

これも見てください ディスカッション

0
microMolvi