Gaussian blur floodlight +

A: floodlight

1. A bright light source and the area to the viewer is often difficult to express, because the brightness of the monitor range is limited. Bright source of differentiating manner that they shine on the monitor, the light diverging light to the surrounding. Such a light source or the observer the bright region will produce a light intensity region is indeed.
2. Glow effect a post processing effects may be used to achieve a floodlight. Floodlight all bright areas of halo effect.
3. Floodlight can greatly enhance the lighting effect in the scene, and offer great results improved, although do it all just a little change.
4. One common misconception is that HDR and pan just like a lot of people think that the two technologies are interchangeable. However, they are two different techniques for respective different purposes. You can use the default 8-bit frame buffer accuracy, when not in use may floodlight effect, using HDR. But then realized after floodlight with HDR is even simpler.
5. To achieve floodlight, as usual we render a scene light extracted HDR color buffer scene and this scene only visible bright areas of the picture. With the extracted image is then blurred luminance, the result is added to the above HDR scenes.
6. This has blurred texture to be added to the upper part of the original HDR scene texture. Because the application of the bright region emitted halo blurring filter, so that bright areas are extended in length and width.
7. Floodlight is not in itself a complex technology, but it is difficult to get the right effect. Its quality depends largely on the quality and type of the blur filter used. Simple change to change the blurring filter will greatly change the quality of flood light effect.

II: extraction bright

1. The first step we extracted from the two images rendered scene. We can render the scene twice, each time using a different shaders to render a different frame buffer, but we can use called MRT (Multiple Render Targets Multiple Render Target) tips, so that we can define a plurality of pixels the shader;
2. With it we can extract the first two pictures in a single rendering process. In the output pixel shader before, we specify a layout location identifier, and we can control a pixel shader written in the buffer which color.
3. A plurality of pixels necessary condition for the output shader that a plurality of color buffer attached to the frame buffer object currently bound. You may recall from the frame buffer where the tutorial, when linked to a texture to the frame buffer color buffer, we can assign a color accessories. Until now, we have been using the GL_COLOR_ATTACHMENT0, but by using GL_COLOR_ATTACHMENT1, we can get an additional two color buffer frame buffer objects:
4. We need to explicitly inform us being rendered by OpenGL glDrawBuffers to multiple color buffer, or OpenGL to render only the first color frame buffer attachment, and ignore all others. We can do this by passing enumerate multiple color attachments
5. When rendered to the frame buffer when a shader modifier layout location, it will fragment it will be used to render the corresponding color buffer. This is great because it saved us a bright area to extract an additional rendering step, because we can now directly extracted from the fragment to be rendered out of them.
6. Here, we first calculate the normal light, passed to a first pixel shader output variables FragColor. Then we use what is currently stored in FragColor to decide whether its brightness exceeds a certain threshold.
7. We calculated through its conversion into a proper luminance gradation of a fragment, if it exceeds a certain threshold, we put a second color to the color output buffer, there holds all the bright portion; cube is rendered luminescent the same.
8. This also explains why the floodlight can run well in HDR basis. Because the HDR, we can specify the color value of more than 1.0 the default range, we can get better control over the brightness of a picture of. HDR we do not have to set the threshold for the number is less than 1.0, while feasible, but can easily become a lot of bright Department, which led to the halo effect too heavy.
9. With a bright area extracted image, we now want this image to blur. We can use the frame buffer post-processing tutorial that simple box filter section, but but we'd better use a more advanced and more beautiful blur filters: Gaussian Blur (Gaussian blur).

Three: Gaussian blur

1. After the treatment course there is a blurred image we use the average of all the surrounding pixels, it does provide a simple fuzzy achieve for us, but the effect is not good. (The nucleus)
2. Gaussian blur Gaussian curve, a Gaussian curve is often described as a bell-shaped curve, the intermediate value is maximized, as the distance increases, decreasing the value of both sides.
3. Gaussian curve at the maximum at the middle of its area, its value is used as a weight such that the sample has the largest near priority. For example, if we sample the fragment from the square area of ​​32 × 32, and the weight as the distance becomes larger gradually decreases fragment; usually this will give better and more real blurring effect, this ambiguity is called Gaussian blur.
4. To achieve a Gaussian blur filter that we need a two-dimensional square as weights, go get it from the two-dimensional Gaussian curve equation. However, this process has a problem that will soon consume a great performance. With a blur kernel of 32 × 32, for example, we must sample each fragment from a texture 1024!
5. Fortunately, Gauss equation has a very clever feature that allows us to break down into two smaller two-dimensional equation of the equation: a descriptive level weights, another describes the vertical weight. We begin with the right level of blurring focuses on the level of the entire texture and vertical blur on the texture altered.
6. Using this feature, the result is the same, but you can save an incredible performance, just as we now do 32 + 32 samples, the 1024 is no longer! This is called a two-step Gaussian blur.
7. This means that for a picture, if we obfuscate, at least two steps, it is best to use a frame buffer object to do it. Specifically, we will achieve the same as table tennis frame buffer to achieve a Gaussian blur.
8. It means that the child has a pair of frame buffers, we have another color frame buffer into color buffer buffering a current frame buffer, the number of different coloring effects render specified. Is substantially constantly switching the frame buffer to draw and texture. First we will blur the scene in a first buffer of the texture, then the first frame buffer into a second color frame buffer buffer fuzzy, then the second frame buffer into a first color buffer a never-ending process.
9. Gaussian blur fragment shader:
   #version 330 core out vec4 FragColor; in vec2 TexCoords; uniform sampler2D image; uniform bool horizontal; uniform float weight[5] = float[] (0.227027, 0.1945946, 0.1216216, 0.054054, 0.016216); void main() { vec2 tex_offset = 1.0 / textureSize(image, 0); // gets size of single texel vec3 result = texture(image, TexCoords).rgb * weight[0]; // current fragment's contribution if(horizontal) { for(int i = 1; i < 5; ++i) { result += texture(image, TexCoords + vec2(tex_offset.x * i, 0.0)).rgb * weight[i]; result += texture(image, TexCoords - vec2(tex_offset.x * i, 0.0)).rgb * weight[i]; } } else { for(int i = 1; i < 5; ++i) { result += texture(image, TexCoords + vec2(0.0, tex_offset.y * i)).rgb * weight[i]; result += texture(image, TexCoords - vec2(0.0, tex_offset.y * i)).rgb * weight[i]; } } FragColor = vec4(result, 1.0); }
10. Here we use a relatively small Gaussian weight redo example, every time we use it to specify a particular fragment of the right of the current weight of the sample horizontal or vertical. You will find us substantially blur filter is divided into a vertical and a horizontal section in accordance with the value of our set of uniform variable horizontal. (Obtained from a vec2 textureSize) to give the actual size of a texel texture size by dividing by 1.0, as based on the offset distance.
11. We created two basic frame buffer fuzzy image processing, each only one color buffer texture.
12. After obtaining a HDR textures, we extracted texturing a bright area frame buffer, then subjected to blurring processing 10 (5 horizontal 5 vertical).
13. We each cycle based on our intention to render horizontally or vertically to bind one of the two buffer which, and the other binding fuzzy texture. The first iteration, since two color buffer is empty so we are free to bind a obfuscate. This procedure was repeated 10 times, the bright area of ​​the image proceeds repeated five times a Gaussian blur. We obfuscate any number of times an arbitrary image; larger more cycles Gaussian blur, blur strength.
14. By extracting the texture bright area five times vague, we get a proper scene bright areas of the image blurred.
15. The final step is to floodlight blurring of images and scenes of the original HDR textures are combined.

Four: two texture blending

1. With bright areas of the scene HDR texture textures and obfuscation, we just put them together we can achieve flood or called the halo effect. The final pixel shader (HDR tutorial and most used almost) want to mix two textures:
   #version 330 core out vec4 FragColor; in vec2 TexCoords; uniform sampler2D scene; uniform sampler2D bloomBlur; uniform float exposure; void main() { const float gamma = 2.2; vec3 hdrColor = texture(scene, TexCoords).rgb; vec3 bloomColor = texture(bloomBlur, TexCoords).rgb; hdrColor += bloomColor; // additive blending // tone mapping vec3 result = vec3(1.0) - exp(-hdrColor * exposure); // also gamma correct while we're at it result = pow(result, vec3(1.0 / gamma)); FragColor = vec4(result, 1.0f); }
2. Note that we want to add floodlight effect before applying the tone mapping. Such added floodlight bright area, will be converted to soft LDR, lighting effect is relatively better. After the combination of two textures, scenes bright areas will have a suitable halo effects.