![[webgl] [基础]非蒙皮模型](http://cdn.chuangxiangniao.com/2025/03/20250307212344640.jpg)
![[webgl] [基础]非蒙皮模型](https://cdn.chuangxiangniao.com/2025/03/20250307212344640.jpg)
1. gl_position = 投影 * 视图 * 模型 * 位置;
从本地/模型位置到最终剪辑空间的位置
三变换maxtrix：
投影：投影变换矩阵
将视图坐标系变换为裁剪空间坐标系
视图：视图变换矩阵
将模型坐标系变换为视图坐标系（移动相机位置）
模型：模型转换矩阵
将本地坐标转换为模型坐标系/游戏世界坐标系（绝对坐标）
postition：顶点的局部坐标
局部坐标系（相对坐标系）
注意：
位置和模型坐标系原点由开发者根据需求定义。
分别对应模型和位置矩阵数据的世界坐标系和模型坐标系：
absolute(world) y+ axis y (0, 1, 0) | | local(model) y+ axis | | / | | / | | | ---------- o (1, 0, 1) ← local(model) origin ---- local x+ axis | / | | / | | / | | / | | / | |______________________/______|__________ x (1, 0, 0) absolute(world) x+ axis / local(model) z+ axis / / / z (0, 0, 1) absolute(world) z+ axis
登录后复制
2. webgl 默认使用列主顺序，而 c++++ 默认使用行主顺序。
在webgl中，矩阵按列主顺序存储，这会影响矩阵排列和计算顺序。这种存储方法影响矩阵在 webgl 中的定义和使用方式。以下是在 webgl 中使用列主矩阵时的一些常见做法：
矩阵定义和排列## 矩阵定义和排列使用列优先存储时，矩阵的列按顺序存储。例如，按列优先顺序排列的 4×4 矩阵 m 如下所示：
m = | m11 m21 m31 m41 | m11 m21 m31 m41 | m11 m21 m31 m41 | m11 m21 m31 m41 | m12 m22 m32 m42 | m12 m22 m32 m42 | m12 m22 m32 m42 | m12 m22 m32 m42 | m13 m23 m33 m43 | m13 m23 m33 m43 | m13 m23 m33 m43 | m13 m23 m33 m43 | m14 m24 m34 m44 |
在 webgl 中，该矩阵表示为按列优先顺序的一维数组：
const matrix = [ m11, m21, m31, m41, // first column m12, m22, m32, m42, // second column m13, m23, m33, m43, // third column m14, m24, m34, m44 // fourth column ];
登录后复制一致的矩阵和数组格式将矩阵数据传递给 webgl 着色器时，必须使用一致的格式。例如，当传递 4×4 转换矩阵时，webgl 的uniformmatrix4fv 函数期望数组按列优先顺序排列：
gl.uniformmatrix4fv(location, false, matrix);
登录后复制
这里， false 表示矩阵不应该转置。由于 webgl 默认使用列优先顺序，请确保数据格式符合此要求，因为 javascript 的标准数学库可能默认使用行优先顺序。
矩阵乘法顺序实际上，列主顺序会影响矩阵的乘法顺序。在此系统中，矩阵相乘从右到左，这意味着首先应用最后一个变换。例如：
所得矩阵m可以表示为变换矩阵t、r和s的乘积：
m = t ⋅ r ⋅ s
在此等式中：
s 是缩放矩阵，r 是旋转矩阵，t 是平移矩阵。
按照列优先顺序，此序列首先应用缩放，然后应用旋转，最后应用平移。
使用实用程序库使用 glmatrix 等库可以简化 webgl 中的矩阵运算。这些库通常遵循列主顺序，符合 webgl 的要求并避免手动矩阵格式调整的需要。例如：
let modelmatrix = mat4.create();// 创建单位矩阵
let modelMatrix = mat4.create();// create a Identity matrix//M = T ⋅ R ⋅ S the principle of mutiply of matrix is from right to left <----- caused by colum major order mat4.translate(modelMatrix, modelMatrix, [x, y, z]); // Translation mat4.rotate(modelMatrix, modelMatrix, angle, [0, 1, 0]); // Rotation mat4.scale(modelMatrix, modelMatrix, [sx, sy, sz]); // Scaling
登录后复制调试和转换了解列主存储有助于调试矩阵计算。如果矩阵结果是意外的，请检查着色器中的数据排列是否与列优先顺序匹配。
以上就是[WebGL] [基础]非蒙皮模型的详细内容，更多请关注【创想鸟】其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至253000106@qq.com举报，一经查实，本站将立刻删除。
发布者：PHP中文网，转转请注明出处：https://www.chuangxiangniao.com/p/2658523.html
