線をはみ出さないお絵かきツール

思いついてしまったので、思わず引き篭もって作ってみました。
CGで絵を書くときに結構めんどくさいのが、
線を越えないように色を塗るってことです。
マスクを作ればいいわけですが、そのマスク作りがめんどい。
ってことで、線を越えない色塗りツールを作ってみました。

http://f38.aaa.livedoor.jp/~sakurai/cgi-bin/test/Paint.html
実行するにはflash player 9が必要です。
最初に線で絵を書きます。
次に、paintって書いてあるボタンを押して、色を塗ります。
そのときに、線を色がこえることはありません!
で、大体の色を塗り終わったら、鋭角の部分の残ったところを塗るためにpaint2を押して塗る。
で、最後に、save zipかなんかで、ファイルをアップロード&ダウンロードしてローカルに保存できます。


処理が重いのは単純に手抜きだからです。内部で1ドットごとに、ブレゼンハムのアルゴリズムマウスポインタの位置から見えるか、見えないかチェックしてるので遅い遅い。


psdでもレイヤー保存とかやろうとおもったんだけど、なんか、参考になるソースがgimpくらいしかなく、めんどくさくなって辞めました。adobeがweb用のphotoshop作って、オプソにしてくれたらいいのになぁ思います。


これは、ベクターベースじゃないので、複雑な絵を書いた場合の鋭角な部分の塗り方がやっぱり、大変になる気がするので、これはもう、ベクターベースでがっちり作ったらいいんじゃと思います。しかし、計算めんどい。。。

ベクターベースで作る場合のアルゴリズムとかのメモ

線画を書く。
線分データが出来上がる。
交差判定を行い、交差点を求め、全ての線分は交差しないようにする。
交差していない線分から、領域を全ての領域を作成する。
まず、閉じていない線分を消す。
あとは、適当な点を選んで右手伝いに回る。点が属している線分の数だけその点は領域に属するので、
その条件を満たしていない点がなくなるまで処理を続ければ完了する。
で色塗り問題をバックトラックしていって解き常にマスクがどうなってるか分かるようにする。色は出来るだけ多いほうが楽だろう。
領域が三角形でなければ、3角形に分割する。
使うアルゴリズムはドローネ分割あるいは、ボロノイ分割などをつかう。
これで、領域判定を完全に行えるし、分割後の線あるいは点の変更によって、楽にならないかなとか。
ここで、色を塗り始められる。選択したポジションに色をぬれる。
繋がっていない場合は、点と点を選択してつなげることが出来る。
色を塗るには色を塗るボタンを押す。すると、色塗り領域の選択を行う状態になる。