The normal matrix should not be used to transform tangents
See original GitHub issueThe normal
is transformed by the normalMatrix
, which is based on the inverse-transform.
The tangent should be transformed like any other direction vector so it remains in the tangent plane.
However, BufferGeometry.applyMatrix()
transforms the tangent like so:
normalMatrix.applyToBufferAttribute( tangent );
This is not correct. It also leaves the tangent unnormalized.
Similarly, in the shader, defaultnormal_vertex.glsl.js
does this:
vec3 transformedTangent = normalMatrix * objectTangent;
In the examples, TerrainShader
uses a similar pattern:
vTangent = normalize( normalMatrix * tangent.xyz );
Issue Analytics
- State:
- Created 4 years ago
- Comments:6 (2 by maintainers)
Top Results From Across the Web
Stop Using Normal Matrix - Eric's Blog
Let's revisit the problem, why we cannot just use model matrix to transform the normal? If the matrix has uniform scale, there won't...
Read more >Geometry (Transforming Normals) - Scratchapixel
In fact, the solution to transforming normals, is not to multiply them by the same matrix used for transforming points and vectors, but...
Read more >How does the transformation on a point affect the normal at ...
This tells us that a normal vector is correctly trans- formed using the inverse transpose of the matrix used to transform points. Vec-...
Read more >Normal Vector Transformation - Nicolás Bertoa - WordPress.com
In this post, I am going to talk about the normal vector and the correct way to transform it. What is the difference...
Read more >The Normal Matrix - Lighthouse3d.com
Simply put the transformation preserves the angle relation between vectors, hence transformed normals remain perpendicular to tangents! Furthermore it preserves ...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
TerrainShader
has been removed.Tangent transform in the shader has been fixed.
That sounds like my mistake. 😓
https://github.com/mrdoob/three.js/issues/18006 looks good!