ねこでじ(Nekodigi)

Nekodigi’s diary

Programming, Art, Travel and etc...

【Processing】Perlinノイズ、Perlinノイズの渦、勾配、を使って画像を変形させる。

成果物

前回、Perlinノイズの勾配を使ってPerlinノイズの渦を作りました。この渦には一か所に集中しないという特性があり、このことが画像変形に役立つのではないと思って作ってみました。試していくと、他のベクトル場でも画像変形出来たので、紹介していきます。

Perlinノイズ

www.youtube.com
Perlinノイズをベクトルの角度としてベクトルを求め、そのベクトル場にそって画像のサンプルをとる位置をずらすとこのようになります。Perticleを使ってベクトル場の様子を観察するとわかる通り、つままれたような変形の仕方をします。

Perlinノイズの勾配

www.youtube.com
このベクトル場は一点に集中するような形になっているのが特徴です。上手くいくか不安だったのですが、このベクトル場の特性が見事に拡大、縮小の効果となって表れています。

Perlinノイズの渦

www.youtube.com
このベクトル場は、特定の箇所に集中せず、ぐるぐると同じ軌道を回り続けるようになっているのが特徴です。画像でもねじれが見事に表れています。

仕組み

画像の補完を行うために、毎度恒例となりつつあるBicubic補完を利用しています。詳しくはこちらをご覧ください。
nekodigi.hatenablog.com
画面上の位置を画像上の位置に対応させればよいので、画面上の位置から出発して、ベクトル場にそって数回に分けて移動させたあとに、map()関数を使って、画面上の位置と画像上の位置を対応させています。

コード

Image_Perlin*という名前で追加しています。
github.com