ツイッターで書いた以下の #つぶやきGLSL の作成ログ。
前回の斜め方向ドットが若干コレジャナイ感があったので焼き直し。
#つぶやきGLSL#define C(c,k)y=abs(.5-sin(t)*2.-(c));if(y<.5&&length(f-.1)<0.1-y*.2)gl_FragColor.rgb+=k;
void main(){
mat3 m=mat3(.9);float y;
vec2 p=(gl_FragCoord.xy*2.-r)/r,l=floor(p*5.)/5.,f=p-l;
C(l.x+l.y,m[0])
C(-l.x+l.y,m[1])
C(l.x-l.y,m[2])
C(-l.x-l.y,m[0]+m[1])
} pic.twitter.com/eh3n5ifwJU— Narumium (@Nr_Narumium) November 12, 2020
前回の斜め塗りつぶしを一過性のものにします。
|
1 2 3 4 5 6 7 8 9 10 11 |
precision highp float; uniform vec2 resolution; uniform float time; void main(){ vec2 r=resolution,p=(gl_FragCoord.xy*2.-r)/r; vec2 l=floor(p*5.)/5.,f=p-l; if(2.-time*2.<l.x+l.y) if(2.-time*2.>l.x+l.y-1.) //if(abs(2.-time*2.-l.x-l.y)<.5) gl_FragColor=vec4(0,.5,0,1); } |
2.-time*2.-l.x-l.y が 0 付近で描画するので、コメントアウト部分のように書き換えた方がシンプルです。多少ズレるのは time を操作する。
ブロックをそれぞれ円にしてみます。
|
1 2 3 4 5 6 |
void main(){ vec2 r=resolution,p=(gl_FragCoord.xy*2.-r)/r; vec2 l=floor(p*5.)/5.,f=p-l; if(abs(2.-time*2.-l.x-l.y)<.5&&length(f-.1)<.1) gl_FragColor=vec4(0,.5,0,1); } |
何か不思議と左下でなく、斜めの物体が下に進んでる感が出てきた。
さらに最大を 0.1 のまま、中心から離れた部分を小さくする。
サイズは y*.2 の部分で調整してますが、値によって印象が変わります。
|
1 2 3 4 5 6 7 |
void main(){ vec2 r=resolution,p=(gl_FragCoord.xy*2.-r)/r; vec2 l=floor(p*5.)/5.,f=p-l; float y=abs(2.-time*2.-l.x-l.y); if(y<.5&&length(f-.1)<0.1-y*.2) gl_FragColor=vec4(0,.5,0,1); } |
前回のように #define して、条件を変えることで4方向に動かします。
|
1 2 3 4 5 6 7 8 9 10 11 |
#define C(c)y=abs(2.-time*2.-(c));if(y<.5&&length(f-.1)<0.1-y*.2)gl_FragColor=vec4(0,.5,0,1); void main(){ vec2 r=resolution,p=(gl_FragCoord.xy*2.-r)/r; vec2 l=floor(p*5.)/5.,f=p-l; float y; C(l.x+l.y) C(-l.x+l.y) C(l.x-l.y) C(-l.x-l.y) } |
4色に分けてみたり。
RGBにもう１つ色を、と言われると Y を入れたくなるのは自分だけだろうか。
|
1 2 3 4 5 6 7 8 9 10 11 12 |
#define C(c,k)y=abs(2.-time*2.-(c));if(y<.5&&length(f-.1)<0.1-y*.2)gl_FragColor.rgb=k; void main(){ mat3 m=mat3(.8); vec2 r=resolution,p=(gl_FragCoord.xy*2.-r)/r; vec2 l=floor(p*5.)/5.,f=p-l; float y; C(l.x+l.y,m[0]) C(-l.x+l.y,m[1]) C(l.x-l.y,m[2]) C(-l.x-l.y,m[0]+m[1]) } |
大体ループについて考えるのは最後の方です。
今回は sin を使ってうまいこと往復するようにしました。
|
1 2 3 4 5 6 7 8 9 |
#define C(c,k)y=abs(.5-sin(t)*2.-(c));if(y<.5&&length(f-.1)<0.1-y*.2)gl_FragColor.rgb+=k; void main(){ mat3 m=mat3(.9);float y; vec2 p=(gl_FragCoord.xy*2.-r)/r,l=floor(p*5.)/5.,f=p-l; C(l.x+l.y,m[0]) C(-l.x+l.y,m[1]) C(l.x-l.y,m[2]) C(-l.x-l.y,m[0]+m[1]) } |
