glsl パターンまとめ

デュプリケート

真ん中ドットパターン(偶数)

もっともオーソドックスなドットパターン、中央から2の倍数で分割されていくパターン、すべての基本
実はあまり使えない

precision mediump float;
uniform vec2  m;       // mouse
uniform float t;       // time
uniform vec2  r;       // resolution
uniform sampler2D smp; // prev scene

void main(void){
	vec2 p = (gl_FragCoord.xy * 2.0 - r) / min(r.x, r.y);
	float n = t;
	p*=n;
	p=mod(p,2.)-1.;
	float l = length(p);
	l=step(0.,1.-l);
	gl_FragColor = vec4(vec3(l), 1.0);
}

https://goo.gl/kRAsgs

このパターンの場合奇数で割れることはない

左下ドットパターン

左下から分割されていくパターン

precision mediump float;
uniform vec2  m;       // mouse
uniform float t;       // time
uniform vec2  r;       // resolution
uniform sampler2D smp; // prev scene

void main(void){
	vec2 p = (gl_FragCoord.xy * 2.0 - r) / min(r.x, r.y);
	float n = t;
	p+=1.;
	p*=n;
	p=mod(p,2.);
	p-=1.;
	float l = length(p);
	l=step(0.,1.-l);
	gl_FragColor = vec4(vec3(l), 1.0);
}

これが足されただけ

	p+=1.;

https://goo.gl/ungtFE

同様に

右上ドットパターン

	p-=1.;

とすると右上

左上ドットパターン

	p.x+=1.;
	p.y-=1.;

とすると左上

右下ドットパターン

	p.x-=1.;
	p.y+=1.;

とすると右下から分割される

真ん中ドットパターン(奇数)

一番よく使う 奇数倍数で真ん中から割る場合、これはかなりはまる。
こちらは偶数で絶対割れないが、最初1つだったものを分割するパターンがほとんどなので、
だいたいこっちが使われる。

precision mediump float;
uniform vec2  m;       // mouse
uniform float t;       // time
uniform vec2  r;       // resolution
uniform sampler2D smp; // prev scene

void main(void){
	vec2 p = (gl_FragCoord.xy * 2.0 - r) / min(r.x, r.y);
	float n = t;
	p*=n;
	p=mod(p+1.,2.)-1.;
	float l = length(p);
	l=step(0.,1.-l);
	gl_FragColor = vec4(vec3(l), 1.0);
}

https://goo.gl/6oPfZM

市松模様(チェック)

背景合成のテスト用に大活躍

 precision mediump float;
 uniform vec2  m;       // mouse
 uniform float t;       // time
 uniform vec2  r;       // resolution
 uniform sampler2D smp; // prev scene
 
 float pCheckers(vec2 p,float n){vec2 q=p*n;return mod(floor(q.x)+floor(q.y),2.0);}

 void main(void){
    vec2 p = (gl_FragCoord.xy * 2.0 - r) / min(r.x, r.y);
    float l = pCheckers(p,5.);
    gl_FragColor = vec4(vec3(l), 1.0);
 }