Processingで以下のアニメーションを実現させたい

Question

Processing初心者なのですがCurvesクラスをつかって、以下のようなアニメーションをさせたいのですが、どのようにすればよいか、ヒントだけでもいいので教えて頂きたいです。(具体的なコードを示して頂けるとなお嬉しいです)

実現したいこと

・Bezierでひいた線の上を沿うように点が移動する
・Bezierで引く線(ポイント)はランダム
・線の切れ目、もしくはウィンドウの端までいったら、START地点にもどって再スタート

どうかよろしくお願いします。

Answer 1

ベジェ曲線で補間する場合は bezierPoint という関数を使います。

ただ、こちらの説明を見ても判るように４点以上の制御点で滑らかに繋ぐのに手間が掛かります。
面倒を避けるなら、catmull-romスプラインの方をお勧めします。

curvePoint がそうです。
※curve関数の説明のほうで、補間方法について言及しています。

点を順にスライドしていく方法については、ここのExample にも書かれているのですが、若干わかりにくいかもしれないですね…

実際に紙の上に自分で大雑把にプロットしてみると分かりやすいのですが、点0〜3がある時に curvePoint で実際に得られる軌道は点1〜2の間になります。
なので、点0-3, 点1-4, 点2-5 点3-6のように、入力する点を１つずつシフトして軌道を得てみると「点1〜5」の軌道が得られます。

端っこが気になる時は、最初と最後を２重にしたデータを作って与えれば、端から端までの軌道を得られます。

Comments

[退会済みユーザー]

ありがとうございました！大変参考になりました！