Fabric.js·Canvasで2Dオブジェクトを自在に描画/操作 MOONGIFT
HTML5の新機能であるCanvasですが、HTMLとは随分使い勝手が違うためになかなか手出ししづらいのではないでしょうか。2D/3Dのどちらも扱えますが、3Dになるとさらに敷居が高くなりますので、まずは2Dから入るのが良さそうです。 Canvas内で2Dオブジェクトを描くのに使えるライブラリがFabric.jsです。Fabric.jsを使ってCanvasを積極的に使ってみましょう。 Fabric.jsの使い方 デモです。様々な描画が行われています。 SVGを描くこともできます。キャッシュ機能を使うと多くのオブジェクトもスムーズに動かせます。 影をつけるデモです。アニメーションもします。 データをJSONで出力できます。 こちらはSVGでの出力結果。 Fabric.jsでは文字や画像の描画、マウスイベント、アニメーション、オブジェクトのグルーピング、マウスによる変形など様々な操作ができるよ
jQuery風に簡単にCanvasを扱えるラッパーライブラリ「Canvas Query」:phpspot開発日誌
Canvas Query jQuery風に簡単にCanvasを扱えるラッパーライブラリ「Canvas Query」 canvasのコードが次のようにjQuery風かつ直感的に記述できます jQueryを使っている人にとってはCanvasがより身近になりそうなライブラリですね スマホ・タブレットの普及でCanvasも重要な技術要素になっていく可能性を秘めていますが、基本を学んだ後はこうしたライブラリを使って便利に扱うのもよさそう 関連エントリ オープンソースのHTML5お絵かきウィジェット「Literally Canvas」 canvasを使って画像をスタイリングするチュートリアル Canvasベースのお絵かきが実装できるjQueryプラグイン「Sketch.js」 CanvasとWebcamで作られたブラウザ上で動作する面白デモｘ２
これはすごい！ゲーム開発に最適な高性能JavaScriptアニメーションフレームワーク「CAAT」 - Chrome Life
前回の記事で、200行で作れるHTML5製テトリスをご紹介してたくさんの反響がありました。 誰もが知っているゲームを少ないコードで実現していることと、コードが読みやすくてプログラミングのスキルアップに役立つということで関心をもたれたと思います。 これを機会に自分でもゲームを作ってみたいと思った方もいるのではないでしょうか？筆者もそのうちの一人です。 しかし、フルスクラッチで作るとなるとそれなりに経験が必要ですし、高度な動きを実現するにはどうやって作れば良いのかも分かりません。 そこで今回ご紹介するのは、ゲーム作りに最適な、高性能JavaScriptアニメーションフレームワーク「CAAT」です。（CAATは、Canvas Advanced Animation Tookitの略） 「CAAT」は完全なゲームフレームワークとして様々な機能が提供されています。 CAATの機能と特徴 オンスクリーン
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
PlayCanvas - The Web-First Game Engine
