ベクトルディスタンスフィールド
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); // 正規化
vec2 q = normalize(p)*.8-p;
float l=step(length(q),.03);
gl_FragColor = vec4(vec3(l), 1.);
}
まずは、ベクトルディタンスフィールドを使って円を描いてみましょう。
普通に円を描いたのと変わりないですね。
ひと手間無駄な変換が入っただけなので、当たり前ですね。
vec2 q = normalize(p)*.8-p;
このqがベクトルディスタンスフィールドで
length関数を掛けるだけで
float l=length(q);
いつでも、ディスタンスフィールドに戻すことができます。
さて、2Dでは使われないnormalize(p)という見慣れないglslの関数が使われていますね。
円のディスタンスフィールドは
1.-length(p)
でしたが、ここから、円のベクトルディスタンスフィールドを推測してみましょう。
1.というのは元は、pの単位ベクトルと推測できるので、normalize(p)と推測ができます。
length(normalize(p)) = 1.
ということは
length(normalize(p)) - length(p)
lengthをまとめると
length(normalize(p)-p)
ベクトルディスタンスフィールドはlengthを使ってスカラーにする前ですので
normalize(p)-p
ちゃんと導けました！
これだけだと、単にひと手間無駄な処理が入るだけなので、
早速、円のベクトルディスタンスフィールドに円のベクトルディスタンスフィールドを乗せていきましょう！
次回