失礼、生やしすぎました。
毛や植物など、形状に対して「生えている」ような見た目にしたい時の考え方のメモです。
文字から何か生えてるとか、よく見るけどかっこいいな、どうやるのかなと思ってちょっと試してみました。
馬の絵から生やすとこんな感じ
これは骸骨です。パラメータ調整に若干ミスって寝ぐせみたいになってます。
以下、解説です。
考え方
１：シェイプを構成する頂点に対して何かを生成すればよい
「生える」ってずいぶん複雑そうだな、と一瞬思いましたが、単純に頂点から何か出てくる表現を
複製する、という表現ができれば目的は果たせそうです。
２：線の進む方向と直角なベクトルで生やす。左なら左、右なら右に固定で
例えば四角形に毛が生えている表現は、一筆で四角形を描いた時に、向かうベクトルに対して左側に毛が生え続ければ
四角から毛が生えているように見える。
３：発生するポイントの制御と、ポイントから発生する枝の制御の２本立てと考える。
今回は、マウスドラッグで座標を配列に追加する処理[MouseMove]
配列を巡回して、それぞれの座標について描画する処理[draw]
という２本立てにしました。
構成
大雑把にこんな感じです
メインクラス
--- 今回はFrocessingで書きます
mousePressedメソッド
addRootメソッドが走ります
mouseMovedメソッド
ドラッグ時にaddNodeメソッドが走ります
addRootメソッド
currentListIndexを更新してpointListList配列に新しい配列をつっこみます
addNodeメソッド
pointListList配列内の、インデックスがcurrentListIndexの配列に対して（pointListListは二重配列です）
LinePointインスタンスを追加します。
LinePointインスタンスは引数で受け取ったpx,pyを参照し、vx,vy,r,vectorの大きさを計算します。
drawメソッド
pointListList配列に入った座標群に対して描画処理を実行します。
基本要素は座標、速度、回転で、
ここのコードでこれらを使ってどう描画するかを設定します。
また、drawメソッドの最初にbackgraond(0,1)を入れると
毎フレームクリアして再描画、つまりアニメーション表現になり、
入れない場合は塗り重ねの静止画表現系になります
LinePointクラス
Pointクラスを拡張して、速度や回転のパラメータを追加したクラスです。
実際のプログラムはこんな感じ。自由にご利用ください。っつてもあんまり使う機会は少なそうですが・・
静止画系
Hair Draw - wonderfl build flash online
アニメーション系
forked from: Hair Draw(Animation) - wonderfl build flash online
