HTML5 + JavaScript アイデア&実践サンプル(古籏一浩氏)の「Flash不要のお絵かきツール」より
Canvasを使ったお絵かきツールです。書籍の流れに従いながら、順次機能を増やしながら製作しています。
ライブラリーやjRueryを使用せず作っています。
マウスを動かすと描画(Canvasの位置を下げたため座標のズレを修正。CSS追加)
点と点を線で滑らかにつなぐ(変数dragFlagの判定位置を変更)
画像をファイルに保存する(ライブラリー不使用)
ブラシの色選択(jQuery不使用。ローカル変数をグローバル化)
ブラシのサイズ変更(jQuery不使用)