Computer Graphics Exercise – Jakob Wagner Computer Graphics Exercise 6. Transformation & Normal Mapping Jakob Wagner for internal use only 6 – Transformation & Normal Mapping Computer Graphics Exercise – Jakob Wagner Normal vector scaling (1.0, 1.0) (2.0, 1.0) - normal n represents orientation of plane p - normal is orthogonal to represented plane p’ . p . (2.0, 1.0) scaling n’ - scale normal like vertices: n (1.0, -1.0) (2.0, -1.0) -> points no longer lie on plane p’ (0.0, 0.0) (0.0, 0.0) represented by normal n’ (1.0, 1.0) (2.0, 1.0) - scale normal inversely to vertices: p . p’ (0.5, 1.0) scaling . -> points still lie on plane p’ represented by n n’ normal n’ (1.0, -1.0) (0.5, -1.0) (0.0, 0.0) (0.0, 0.0) 6 – Transformation & Normal Mapping 2 Computer Graphics Exercise – Jakob Wagner Normal transformation -1 - normal must be transformed with inverted scale -> Mnormal = Mvertex - through the matrix inversion an included rotation is also inverted - the inverse of a rotation matrix is its transpose -> R-1 = RT - the transposing does not change the effect of a scaling matrix -> ST = S -1 T - transpose inverted matrix to restore correct rotation -> Mnormal = (Mvertex ) - translation is irrelevant, as normals only represent orientation -T -> transform normals with inverse-transpose of vertex transform matrix -> Mnormal = Mvertex 6 – Transformation & Normal Mapping 3 Computer Graphics Exercise – Jakob Wagner Transformation spaces Model Space World Space View Space Model View Matrix Matrix - vertex attribute definition - model transformations - lighting computations 6 – Transformation & Normal Mapping 4 Computer Graphics Exercise – Jakob Wagner Normal Mapping vertex normals texture normals - normals are a vertex attribute -> surface orientation can only be defined at vertices -> no explicit normal definition between vertices possible - textures are looked up per-fragment -> level of detail solely dependent on texture resolution -> storing normals in a texture allows arbitrary surface detail http://blog.wolfire.com/2009/10/character-normal-maps/ 6 – Transformation & Normal Mapping 5 Computer Graphics Exercise – Jakob Wagner Model Space Normal Mapping - normals in texture replace vertex normals - R,G,B channels store X,Y,Z orientation of normal in model space channels: combined - x: direction to right & left x y z normal map - y: direction up & down - z: direction forward & backward - workflow: a. map texture to model b. encode normal orientation in texture c. apply normal map to model d. in fragment shader, read detail normal from texture e. transform detail normal from model- into view-space f. use detail normal in lighting computation http://blog.wolfire.com/2009/10/character-normal-maps/ 6 – Transformation & Normal Mapping 6 Computer Graphics Exercise – Jakob Wagner Normal Mapping Variants - model space normal map encodes normals of relative to model -> normal map replaces vertex normals -> normal map needs to be recomputed when the surface is deformed or rotated -> normal map cannot be used on other models (e.g. differently rotated flat planes) tangent space texture projection model space normals vertex normals normals top back normal mapping on a cube: right left - = botto front m - tangent space normal map encodes normals relative to covered surface -> normal map can still be used when the surface is deformed and rotated as it is defined relative to it -> normal map can be used on multiple models (e.g. all flat planes) http://www.3dtotal.com/index_tutorial_detailed.php?id=1106&page=2 6 – Transformation & Normal Mapping 7 Computer Graphics Exercise – Jakob Wagner Tangent Space - a space is defined by a reference frame of basis vectors - tangent space describes the underlying surface at a point on the mesh -> what are the basis vectors for tangent space? - a space is defined by a reference frame of basis vectors - the normal vector represents the z-axis, pointing away from the surface - two more vectors are required, must lie on the surface to be orthogonal to normal vector - only existent further information about surface are the texture coordinates of surrounding vertices -> use texture u- and v-axes to span two additional vectors, tangent and bitangent normal and texture normal with tangent and normal coordinates bitagent n n n . v u 6 – Transformation & Normal Mapping 8 Computer Graphics Exercise – Jakob Wagner Tangent Space - d1 and d2 are the triangle edge directions in model space - d1’ and d2’ are edge directions in texture space (relative to u and v base axes) - u’ and v’ are the texture space bases in model space called tangent and bitangent - tangent and bitangent form together with the surface normal an orthogonal space, the tangent space representing the surface of a triangle model space texture space model space 1 1 2 n u’ d2’ d1 v d1 . v’ d ’ 1 1 3 3 2 d2 3 2 u d2 6 – Transformation & Normal Mapping 9 Computer Graphics Exercise – Jakob Wagner p Tangent Calculation 1 - tangent t and bitangent b represent the texture u- and v-axes in model space Δp1 p - ti is the texture coordinate of pi: ti = (ui, vi) b - Δp1 = p1 - p0 , Δp2 = p2 - p0 p t p - the position of any point on the plane can be calculated using its uv-coordinates: 0 Δp2 2 pi = p0 + Δui ∙ t + Δvi ∙ b - this equation must also hold for p1 and p2: Δp1 = Δu1 ∙ t + Δv1 ∙ b and Δp2 = Δu2 ∙ t + Δv2 ∙ b in matrix form: Δp : x Δp : y Δp : z Δu Δv t : x t : y t : z 1 1 1 = 1 1 ∙ Δp2 : x Δp2 : y Δp2 : z Δu2 Δv2 b : x b : y b : z - multiply with inverse of uv-coordinate matrix: t : x t : y t : z 1 Δv2 -Δv1 Δp1 : x Δp1 : y Δp1 : z ____________________ ∙ = Δu ∙Δv - Δu ∙Δv ∙ b : x b : y b : z 1 2 2 1 -Δu2 Δu1 Δp2 : x Δp2 : y Δp2 : z http://web.archive.org/web/20160409104130/http://www.terathon.com/code/tangent.html 6 – Transformation & Normal Mapping 10 Computer Graphics Exercise – Jakob Wagner Tangent Computation 1. start with null-vectors for vertex tangents ti 2. for each triangle a. calculate tangent t of current triangle and normalize it b. add t to ti of the three vertices forming the triangle 3. for each vertex a. orthogonalize tangent relative to normal: t’ = t - n ∙ dot(n, t) b. normalize tangent - for mirrored texture projections the handedness of the tangent also needs to be stored (ignored in the exercise) - the bitangent is assumed to be orthogonal to the normal and tangent -> calculating it with cross(n, t) in the fragment shader saves the space of an additional vertex attribute http://www.terathon.com/code/tangent.html 6 – Transformation & Normal Mapping 11 Computer Graphics Exercise – Jakob Wagner Tangent Space Normal Mapping p - tangent-space normal maps can be interpreted as containing offsets or a rotation v of the vertex normal - the red component controls the offset along the horizontal axis (u / tangent) - the green component controls the offset along the vertical axis (v / bitangent) - the blue component controls the offset along the outward axis (w / normal) w u - concept: the normal np at position p is defined as np = cr∙ t + cg∙ b + cb∙ n with c = (cr, cg, cb) being the normal texture color at p - implementation: np = Mtangent∙ (cr, cg, cb) – with Mtangent = [t, b, n] b n n - workflow: p p a. map texture to model b. encode normal orientation in texture t c. apply normal map to model d. in fragment shader, read the detail normal from the texture e. create tangent-space matrix from tangent, bitangent and normal in view-space f. transform detail normal from tangent- into view-space using tangent-space matrix g. use detail normal in lighting computation 6 – Transformation & Normal Mapping 12 Computer Graphics Exercise – Jakob Wagner Transformation spaces - texture channels are normalized (from 0 to 1) but normal direction components have different ranges: - X-axis: right: 1.0 to left: -1.0 - Y-axis: up: 1.0 to down: -1.0 - Z-axis: forward: 1.0 to nothing: 0.0 (normal cannot point inwards) -> after reading the normal from the texture, the values must be adjusted so that they lie in the correct range View Space Tangent Space Texture Space b n Tangent range v Matrix adjust t w u - lighting computations - detail normals - encoded normals with normalized ranges 6 – Transformation & Normal Mapping 13 Computer Graphics Exercise – Jakob Wagner Assignment 4 – Normal Mapping Tangent Calculation - implement the model_loader::generate_tangents() function - request the model loader to calculate the tangents by replacing the last parameter “model::NORMAL|model::TEXCOORD” of the model_loader::obj() function call with “model::NORMAL|model::TEXCOORD|model::TANGENT” - in the planet_object initialisation, add another attribute of the type “model::TANGENT” Normal map - load a normal map for a planet and bind it to an additional Texture Unit and upload its index to a new uniform in the shader Normal mapping - in the planet vertex shader add another input attribute “layout(location = 3) in vec3 in_Tangent“ that is transformed into view-space using the Normal Matrix and then assigned to an output variable “vec3 pass_Tangent” - in the fragment shader add another input “vec3 pass_Tangent” - sample the normal texture with “pass_TexCoord” and use the resulting rgb color as the normal in texture space - transform the normal from texture into tangent space by adjusting the range of the components - transform the normal from tangent- into view-space by multiplying it with the tangent matrix built from view-space normal, tangent and bitangent 6 – Transformation & Normal Mapping 14.