Web上で絵を描いたり、画像に装飾を施したいと思うことが多々あります。画像をCanvasに読み込んで、後は線を引いたりすれば良いのですが、その実装は意外と複雑です。さらに間違った時のために消しゴム機能などもいるでしょう。 そうしたペイント機能の基盤に使えそうなのがpaintDrawです。

paintDrawの使い方

線を描いているところ。開発者ツールが開いているのは、キーボードショートカットがコメントに書かれているため。

自由線だけでなく、円や四角も描けます。

paintDrawはキーボードショートカットで線種を変更します。例えばCを押すと円が描けるといった具合です。もちろん、それはボタンなどに代用可能でしょう。基本的な機能しかありませんが、カスタマイズ前提で利用できそうです。

paintDrawはJavaScript製のオープンソース・ソフトウェア(MIT License)です。

victorqribeiro/paintDraw: A JavaScript paint and draw app.