Problem understanding the use of a point product in this example?

Question

I usually use the point product of two vectors to find out how perpendicular they are or the cosine of the angle between them. In this shader, the tone shader, the dot product is used in two colors, and I can’t plunge into exactly what it does.

uniform vec2 resolution; uniform sampler2D backBuffer; void main(void) { vec4 to_gray = vec4(0.3,0.59,0.11,0); float x1 = dot(to_gray, texture2D(backBuffer,vec2((gl_FragCoord.xy + vec2(1.0,1.0)) /resolution.xy)).rgba); float x0 = dot(to_gray, texture2D(backBuffer,vec2((gl_FragCoord.xy + vec2(-1.0,-1.0)) /resolution.xy)).rgba); float x3 = dot(to_gray, texture2D(backBuffer,vec2((gl_FragCoord.xy + vec2(1.0,-1.0)) /resolution.xy)).rgba); float x2 = dot(to_gray, texture2D(backBuffer,vec2((gl_FragCoord.xy + vec2(-1.0,1.0)) /resolution.xy)).rgba); float edge = (x1 - x0) * (x1 - x0); float edge2 = (x3 - x2) * (x3 - x2); edge += edge2; vec4 color = texture2D(backBuffer,vec2(gl_FragCoord.xy / resolution.xy)); gl_FragColor = max(color - vec4(edge, edge, edge, edge) * 12.0, vec4(0,0,0,color.a)); } 

Answer 1

The "geometric" scalar (point) properties of the product in this case are not of great importance. Here you have the usual color conversion (R, G, B) to the corresponding gray intensity I according to the formula

 I = R * 0.30 + G * 0.59 + B * 0.11 

(You can learn more about these ratios here: https://en.wikipedia.org/wiki/Grayscale#Luma_coding_in_video_systems ).

As you can see right away, this formula looks like a scalar product of two vectors: one is our color (R, G, B) and the other is (0.30, 0.59, 0.11) . So, the author of the code simply used the "scalar product" function to evaluate this formula for four different color values ​​obtained at four different points: the point gl_FragCoord.xy shifted in four different directions (like pattern x ).

In other words, the scalar product in this case is not used on the "two colors", as you seemed to initially assume. It is used for color (a pixel taken from backBuffer with some coordinates) and a transform coefficient vector (0.30, 0.59, 0.11) (aptly named to_gray ). The latter is not quite color. This is just a vector of transform coefficients. You can think of it as a “color” if you want, but that doesn't make much sense.

What is this point product.

They then do some additional calculations to combine the four grayscale values ​​into one grayscale value. They then use this value in grayscale to change the original color at gl_FragCoord.xy (the gray values ​​are subtracted from the RGB values ​​in gl_FragCoord.xy ). The purpose of all this is not entirely clear without context.