| IEでもCSS3 その3(css3shadow)ブログトップ | HTML関連 | JavaScript関連 | サーバの障害が復旧いたしました
HTML5でお絵かきツール
この記事は1年以上前の記事のため、内容が古い可能性があります。
HTML5のCanvasを使ってお絵かきツールv0.5を作ってみました。
ベースはASCⅡ.jpのこちらの記事を参考に作成。そこに「カラーピッカー.js」や「rgbcolor.js」を投入し、「Canvas Painter」というサイトのソースを参考にさせてもらいながら作りました。
ファイヤーフォックスでしか動かない、レイアウトが雑、ツールの機能がまだ不十分(特に不透明度・ブラシ(ぼかし))など問題点が多々ありますが、一応上げてみます。
お絵かきツールv0.5サンプル [新しいウィンドウで開く] (Firefox3.6以上でのみ正常動作します)
※ソースについて
今回、自分で改良したファイルは
- examples/index.html
- draw/draw.js
- rgbcolor/rgbcolor.js (this.toRGBに引数を付け加えただけ)
だけです。
その他については上記で掲載したサイトからダウンロードしたり、載っていたソースをそのまま使用しています。
制作にあたり、今回は以下のサイトを参照させていただきました。
HTML5.jp:該当ページ「Canvas」「Javascript ライブラリー」
トラックバック
トラックバックURL