「つぶやきGLSLと形で覚えるmod」 - テルメモ

はじめに

GLSL初学者のmod関数のメモです。
関数の情報を集めて勉強しています、書きかけのメモです。
（追加で調べたらアップデートします）

modの基本

GLSLの組み込み関数を読む時に
いつも参考にさせていただいている記事のmodを見ると。

引数は2つ。Xから、XをYで割った値を切り下げて、引く。
と余った値が返ってくるっぽい。 

> mod(x, y)
x - y * floor(x/y)を返す
参考: GLSLについてのメモ

mod - moduloは日本語で剰余演算。

剰余演算（モジュロとも呼ぶ）は、コンピュータにおいて、
ある数値を別の数値で除算し、余りを取得する演算である

参考: Wikipedia 剰余演算

The Book of Shaders の図解

The Book of Shaders - mod

なるほど。剰余演算で、ある一定の値を繰り返すことに使える。
※「余りの性質(正数のみ)」の項参照。
三角関数だと、0-1に行ったら1-0に戻るけど
剰余演算なら、0-1、0-1を繰り返せるイメージ。

余り(剰余)の性質をプログラムに活かす

つぶやきGLSLで試す

単純に、gl_FragColorのRGBにfloatで入れる。

void main(){
 vec2 p=(gl_FragCoord.xy*2.-r)/min(r.y,r.x);
 
 gl_FragColor=vec4(mod(p.x, p.y),mod(-p.x, -p.y),mod(p.y, -p.x),1);
}

vec2で計算してRGに入れる。

void main(){
 vec2 p=(gl_FragCoord.xy*2.-r)/min(r.y,r.x);
 p=mod(p, vec2(sin(p*t)));
 gl_FragColor=vec4(p,1,1);
}

右側から始まっちゃうので、多分absだなと。
vec2で計算した値にabsで絶対値にしてみる。
やってみたら良い動きになった。

void main(){
 vec2 p=(gl_FragCoord.xy*2.-r)/min(r.y,r.x);
 p=mod(p, vec2(sin(p*t)));
 gl_FragColor=vec4(abs(p),1,1);
}

やっぱり分からないことだらけやで。

追記: modをもっと理解する