CODEWITHSUNDEEP
openglglsl
user8028736
user8028736

Reputation:

How to add vertical Gaussian blur

This is my Fragment shader code where i am applying gaussian blur to a Texture2D image.

vec3 incrementalGaussian;
incrementalGaussian.x = 1.0f / (sqrt(2.0f * pi) * BlurValue  );
incrementalGaussian.y = exp(-0.5f / (BlurValue  * BlurValue ));
incrementalGaussian.z = incrementalGaussian.y * incrementalGaussian.y;
 vec4 avgValue = vec4(0.0f, 0.0f, 0.0f, 0.0f);
float coefficientSum = 0.0f;

// Take the central sample first...
avgValue += texture2D(text, TexCoords.st) * incrementalGaussian.x;
coefficientSum += incrementalGaussian.x;
incrementalGaussian.xy *= incrementalGaussian.yz;

//Go through the remaining 8 vertical samples (4 on each side of the center)

for (float i = 1.0f; i <= numBlurPixelsPerSide ; i++) { 
    avgValue += texture2D(text, TexCoords.st - i * 0.01f * 
               blurMultiplyVec) * incrementalGaussian.x;         
    avgValue += texture2D(text, TexCoords.st + i * 0.01f * 
                blurMultiplyVec) * incrementalGaussian.x;         
    coefficientSum += 2 * incrementalGaussian.x;
    incrementalGaussian.xy *= incrementalGaussian.yz;
avgValue.g = avgValue.r;
avgValue.b = avgValue.r;
color =  avgValue * vec4(textColor, 1.0)  / coefficientSum ;
}

this only applies a horizontal blur , How can i also add vertical Gaussian blur.

Upvotes: 2

Views: 1279

Answers (1)

Rabbid76
Rabbid76

Reputation: 211277

In general for the gaussian blur are used 2 passes. For the vertical blur, you've to add a 2nd pass. First do the horizontal blur, then apply the vertical blur to the result.

For the horizontal blur the u-component of the texture coordinate is displaced:

for (float i = 1.0f; i <= numBlurPixelsPerSide ; i++) { 
    float offset = i * 0.01f * blurMultiplyVec;
    avgValue += texture2D(text, TexCoords.st - vec2(offset, 0.0) * incrementalGaussian.x;
    avgValue += texture2D(text, TexCoords.st + vec2(offset, 0.0) * incrementalGaussian.x;
    // ...
}

And for the vertical blur the v-component of the texture coordinate is displaced:

for (float i = 1.0f; i <= numBlurPixelsPerSide ; i++) { 
    float offset = i * 0.01f * blurMultiplyVec;
    avgValue += texture2D(text, TexCoords.st - vec2(0.0, offset) * incrementalGaussian.x;
    avgValue += texture2D(text, TexCoords.st + vec2(0.0, offset) * incrementalGaussian.x;
    // ...
}

A related question is What kind of blurs can be implemented in pixel shaders?
There are a lot of good tutorials all over the web, e.g. LearnOpenGL.com - Gaussian blur

Upvotes: 2

Related Questions