HTML5 Canvas Vector Graphics？

Question

HTML5 Canvas内でベクターグラフィックを描画したり処理したりするためのライブラリを教えてください。

ありがとうございます！

Answer 1

いくつかのオプションがあります。私はこれらのライブラリのどちらも使用していませんが、Cakeが一般的にもっと印象的で、輸入されていると言えるものから、3倍も大きいものからです。現在Burst Engineもあり、現在はprocessing.jsの拡張版です。これはさらに小さくなっています。私はそこにいくつかの詳細があると確信しています。

Processing.js

"Processing.jsが...人気処理ビジュアルプログラミング言語の姉妹プロジェクトである"

サイズ：412キロバイト

Raphael

「ラファエルが小さいですWeb上のベクターグラフィックスを使用して作業を簡素化するJavaScriptライブラリ。たとえば、独自のチャートや画像の切り抜きや回転ウィジェットを作成する場合は、単純にこのライブラリで簡単にd。 RaphaëlはSVG W3C勧告とVMLをグラフィックス作成のベースとして使用します。つまり、作成するすべてのグラフィカルオブジェクトもDOMオブジェクトなので、JavaScriptイベントハンドラをアタッチしたり後で変更したりすることができます。ラファエルの目標は、ベクトルアート互換性のクロスブラウザと簡単に描画するようになりますアダプタを提供することである「

サイズ：60 KB

Snap.svg

ラファエルの後継同じ開発者によって書かれたが、意図します

"スナップは、既存のSVGコンテンツとスナップで生成されたSVGコンテンツのアニメーション化と操作のための、クリーンで、合理的で、直感的で強力なAPIをWeb開発者に提供します。 。、スナップは、あなたのSVGコンテンツをよりインタラクティブで魅力的にすることができ、アニメーションのためのシンプルで直感的なJavaScriptのAPIを提供することにより

「

サイズ：66キロバイト

Cake

」ケーキはシーングラフでありますキャンバスタグのライブラリ。あなたはそれがSVGのサンセリフのようなXMLだとあまりにも遠くではないことを言うことができる「

サイズ：212キロバイト

Paper.js

」。Paper.jsを動作させているオープンソースのベクターグラフィックススクリプティングフレームワークですがHTML5 Canvasの上部」を参照してください。

サイズ：62791キロバイト

The Burst Engine

は「バーストエンジンはHTML5キャンバス要素のオープンソースベクトルアニメーションエンジンである。バーストがフラッシュに似たウェブの機能を提供し、After Effectsのような層ベースのアニメーションシステムが含まれている。バーストが非常に軽い使用しますあなたのアニメーションはすばやくダウンロードされ、非常にシンプルなJavaScriptコマンドを使用して制御することができ、連鎖とコールバックが可能になります...バーストは現在、John Resigによる優れたアニメーションポートProcessing.jsの拡張です。 jQueryやProcessing.jsを使用せずにBurstを使用したい場合は、ロード時間とメモリ使用量を減らすことができます。

注：今後のバージョンのバーストもネイティブ処理アプリケーションとして動作し、Javaアプレットまたはバイナリ実行可能ファイルでバーストアニメーションを実行できます。

また、最後に更新されたようで、2010年

サイズ：52.6キロバイト

drawing directly to the canvas with .context

これは、外部のライブラリではありませんが、JavaScriptによるキャンバスに直接描画します。

Answer 2

http://raphaeljs.com/ SVGとよく

Answer 3

http://glimr.rubyforge.org/cake/canvas.htmlに動作します（cakejs）

Answer 4

http://paperjs.org/が最近発表されました。すごい。

Answer 5

http://canvimation.github.com/は、キャンバスタグとコンテキストコマンドを使用して図面を再現するためのWebページとしての結果を、画面上に描画してエクスポートできるオープンソースのアプリケーションです。いくつかのアニメーションが利用可能です。それは開発中です。ヘルプページも利用可能です。