WingMemo: HTML5でお絵かきツールを作ってみた(2)

前回、こんな記事を書きました。 HTML5でお絵かきツールを作ってみた これでいろいろ遊んでたんですが、描いてると「やっぱりこれは欲しい…」というのは出てきますね。で、前回のに機能をいくつか追加してみました。 ■スポイトを追加する 描いてる途中で「さっき使った色をもう一度使いたい」と思うことはけっこうあります。というか、必ずあります…。しかしこれが難しい。色が増えるとどれがさっき使った色なのか分からなくなる。それでもパレットから採った色なら丹念に探せばいつかは見つかるけど、カラーピッカーから採った色ならもう絶望的です。二度と見つからない(^^;。これはやっぱりスポイトは必須でしょう！てことで頑張って設置してみました。 getImageDataをhogehogeという変数に入れた場合、取得したデータはhogehoge.dataでRGBカラーの数字を取得できるようです。赤ならhogehoge.

[shozzy]

JavaScriptでスポイトツール（canvas内のデータが対象）

[alfe1025]

使い勝手の良さそうなcanvas+絵画ツールの実装例