2011/10/21
なぜ？CanvasではなくCSS3を駆使して描くドローライブラリ「Donatello」
HTML5を利用すればこれまで画像やFlashを使わざるを得なかった描画がJavaScriptとCSSを組み合わせて実現できるようになります。どれくらい奇麗なグラフィックスを描けるのか、さらにそれをいかに手軽に実現できるかを知るのにDonatelloはぴったりなライブラリです。 0
サンプルです。時刻に合わせてオブジェクトの描画が変わります。
0
四角い形が円に沿って描画されていくサンプルです。HTMLの内容を見ると分かりますが、JavaScriptを使ってダイナミックにレンダリングしています。
0
このような複雑な形も描けます。
0
時計そっくりな描画も。こちらは実際に針が動きます。
0
四角が繰り返される描画。JavaScriptで描画内容をコーディングしているので幾何学系のアートが多いです。
0
実際のコード。複雑ではありますが、Donatelloの使い方を覚えれば同じくらいの描画ができるようになるはず。
0
Donatelloが描くオブジェクトはペーパーと呼びます。そのペーパーの上に四角や円を描いていくという仕組みになっているので、プログラミングは割合分かりやすそうです。描けるオブジェクトは正多角形、ベジュ曲線、グラデーションなどとなっています。 0
さらに機能としてjQuery対応、グループ化、クリックサポートなどとなっています。DonatelloはMIT Licenseのオープンソース・ソフトウェアです。 0
プレミアムユーザには“MOONGIFTはこう見る”、記事の一行概要、追加スクリーンショット、デモや追加URLが表示されます。登録（500円/月）はこちらから！ プレミアムユーザのログインはこちらから 0
MOONGIFTの関連記事
このエントリーを含むTwitter
アンケート