Graphics Reference
In-Depth Information
where there is an edge, the output color is light. This visually validates the con-
cept of detecting edges, though in many applications you would go on to make
processing decisions based on these edges rather than simply displaying them.
Below, you see an example of some fragment shader code that imple-
ments these ideas. The colors of the 3 × 3 set of pixels are retrieved from the
image texture, a dot product of each is done with the luminance weight vector
to convert the 3 × 3 image to grayscale, and then the Sobel filters are applied
and the two results combined to set a single grayscale output value. Finally,
that output value is mixed with the original color according to a
glman
uniform
slider variable,
uT
.
ivec2 ires = textureSize( uImageUnit, 0 );
float ResS = float( ires.s );
float ResT = float( ires.t );
vec3 irgb = texture( uImageUnit, vST ).rgb;
vec2 stp0 = vec2(1./ResS, 0. );
vec2 st0p = vec2(0. , 1./ResT);
vec2 stpp = vec2(1./ResS, 1./ResT);
vec2 stpm = vec2(1./ResS, -1./ResT);
const vec3 W = vec3( 0.2125, 0.7154, 0.0721 );
float i00 = dot( texture( uImageUnit, vST ).rgb, W );
float im1m1 = dot( texture( uImageUnit, vST-stpp ).rgb, W );
float ip1p1 = dot( texture( uImageUnit, vST+stpp ).rgb, W );
float im1p1 = dot( texture( uImageUnit, vST-stpm ).rgb, W );
float ip1m1 = dot( texture( uImageUnit, vST+stpm ).rgb, W );
float im10 = dot( texture( uImageUnit, vST-stp0 ).rgb, W );
float ip10 = dot( texture( uImageUnit, vST+stp0 ).rgb, W );
float i0m1 = dot( texture( uImageUnit, vST-st0p ).rgb, W );
float i0p1 = dot( texture( uImageUnit, vST+st0p ).rgb, W );
float h= -1.*im1p1-2.*i0p1-1.*ip1p1+1.*im1m1+2.*i0m1+1.*ip1m1;
float v= -1.*im1m1-2.*im10-1.*im1p1+1.*ip1m1+2.*ip10+1.*ip1p1;
float mag = length( vec2( h, v ) );
vec3 target = vec3( mag, mag, mag );
fFragColor = vec4( mix( irgb, target, uT ), 1. );
Embossing
We can modify the idea of edge detection to include replacing color by lumi-
nance and highlighting images differently depending on the edges' angles.
The result is the emboss operation that is commonly found in image manipu-
lation programs. The result of an emboss operation is shown in Figure 11.12,
and the code for a fragment shader to accomplish this is shown below. This
