純粋にGLSLを使用した2Dモーションブラーとガウスのブラー

Question

純粋なGLSLを使用してモーションブラーまたはガウスブラーを実装したいと考えています。
私はいくつかの基本シェーダを作成しましたが、私はすでにいくつかの考えを念頭に置いています。

マイシェーダ：

頂点シェーダ：

attribute vec4 a_color; 
attribute vec2 a_position; 
attribute vec2 a_texCoord0; 

uniform mat4 u_projTrans; 

varying vec4 v_color; 
varying vec2 v_texCoord0; 

void main() { 
    v_color = a_color; 
    v_texCoord0 = a_texCoord0; 
    gl_Position = u_projTrans * vec4(a_position, 0.0f, 1.0f); 
} 

フラグメントシェーダ：

varying vec4 v_color; 
varying vec2 v_texCoord0; 

uniform vec2 screenSize; 

uniform sampler2D u_texture; 
uniform vec4 v_time; 

const float RADIUS = 0.75; 

const float SOFTNESS = 0.6; 

void main() { 
    vec4 texColor = texture2D(u_texture, v_texCoord0); 
    vec4 timedColor = (v_color + v_time); 

    vec2 position = (gl_FragCoord.xy/screenSize.xy) - vec2(0.5); 
    float len = length(position); 

    float vignette = smoothstep(RADIUS, RADIUS-SOFTNESS, len); 

    texColor.rgb = mix(texColor.rgb, texColor.rgb * vignette, 0.5); 

    gl_FragColor = vec4(texColor.rgb * timedColor.rgb, texColor.a); 
} 

純粋にGLSLを使用してぼかしを作成することをお勧めしますか？どのようにそれを行うには誰にもアイデアがありますか？
私はいくつかのアイデアを念頭に置いて自分自身の質問に答えることもできます。

Answer 1

私は自分の質問に答えるつもりです。

結局、私は唯一のフラグメントシェーダを変更：

varying vec4 vColor; 
varying vec2 vTexCoord; 

uniform vec2 screenSize; 

uniform sampler2D u_texture; 
uniform vec4 v_time; 

const float RADIUS = 0.75; 

const float SOFTNESS = 0.6; 

const float blurSize = 1.0/1000.0; 

void main() { 

    vec4 texColor = vec4(0.0); // texture2D(u_texture, vTexCoord) 
    texColor += texture2D(u_texture, vTexCoord - 4.0*blurSize) * 0.05; 
    texColor += texture2D(u_texture, vTexCoord - 3.0*blurSize) * 0.09; 
    texColor += texture2D(u_texture, vTexCoord - 2.0*blurSize) * 0.12; 
    texColor += texture2D(u_texture, vTexCoord - blurSize) * 0.15; 
    texColor += texture2D(u_texture, vTexCoord) * 0.16; 
    texColor += texture2D(u_texture, vTexCoord + blurSize) * 0.15; 
    texColor += texture2D(u_texture, vTexCoord + 2.0*blurSize) * 0.12; 
    texColor += texture2D(u_texture, vTexCoord + 3.0*blurSize) * 0.09; 
    texColor += texture2D(u_texture, vTexCoord + 4.0*blurSize) * 0.05; 

    vec4 timedColor = (vColor + v_time); 

    vec2 position = (gl_FragCoord.xy/screenSize.xy) - vec2(0.5); 
    float len = length(position); 

    float vignette = smoothstep(RADIUS, RADIUS-SOFTNESS, len); 

    texColor.rgb = mix(texColor.rgb, texColor.rgb * vignette, 0.5); 

    gl_FragColor = vec4(texColor.rgb * timedColor.rgb, texColor.a); 
} 

実際のぼかし効果がここに書かれている：

vec4 texColor = vec4(0.0); // texture2D(u_texture, vTexCoord) 
    texColor += texture2D(u_texture, vTexCoord - 4.0*blurSize) * 0.05; 
    texColor += texture2D(u_texture, vTexCoord - 3.0*blurSize) * 0.09; 
    texColor += texture2D(u_texture, vTexCoord - 2.0*blurSize) * 0.12; 
    texColor += texture2D(u_texture, vTexCoord - blurSize) * 0.15; 
    texColor += texture2D(u_texture, vTexCoord) * 0.16; 
    texColor += texture2D(u_texture, vTexCoord + blurSize) * 0.15; 
    texColor += texture2D(u_texture, vTexCoord + 2.0*blurSize) * 0.12; 
    texColor += texture2D(u_texture, vTexCoord + 3.0*blurSize) * 0.09; 
    texColor += texture2D(u_texture, vTexCoord + 4.0*blurSize) * 0.05; 

効果は純粋にGLSLと、ガウスぼかしになります。 いつでも好きなように変数を調整できます。