如何添加垂直高斯模糊答案

【问题标题】：How to add vertical Gaussian blur如何添加垂直高斯模糊
【发布时间】：2019-07-19 21:58:46
【问题描述】：

这是我将高斯模糊应用于 Texture2D 图像的片段着色器代码。

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 ;
}

这仅适用于水平模糊，我如何也添加垂直高斯模糊。

【问题讨论】：

标签： opengl glsl

【解决方案1】：

一般来说，高斯模糊使用 2 遍。对于垂直模糊，您必须添加第二遍。先做水平模糊，然后再对结果应用垂直模糊。

对于水平模糊，纹理坐标的 u 分量被位移：

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;
    // ...
}

而对于垂直模糊，纹理坐标的 v 分量被位移：

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;
    // ...
}

一个相关的问题是What kind of blurs can be implemented in pixel shaders?
网上有很多很好的教程，例如LearnOpenGL.com - Gaussian blur

【讨论】：

我有一个问题，如果我们想对场景应用模糊而不是将其渲染到我们的帧缓冲区并从中创建纹理并将其传递给着色器。
对于纹理，我们不必将其渲染到帧缓冲区。
我们怎样才能对纹理进行多次传递。
与 LearnOpenGL.com 相同 - 对图像而非场景进行高斯模糊。
@shomit 第一次将纹理渲染到新纹理，第二次将纹理渲染到场景。