问题起源

在计算漫反射关照时,需要用到法线,通过法线和光线的点乘值,计算漫反射的产生的光线强度,所以需要从顶点着色器中将法线数据传递到片源着色器中,但是片源着色器中的顶点坐标是经过了模型矩阵变化过的世界坐标.所以二者很可能已经不匹配了,当然模型矩阵是单位矩阵的特殊情况下,就没有影响.

对法线进行mv变换

因此,需要对法线也应用mv矩阵变换.这样,模型的在旋转和缩放后,法线才能也与之匹配,如下图这样:

去掉对法线的偏移效果

但有个问题,就是偏移,如果法线跟着一起偏移,方向就会出问题了,加入模型矩阵沿x方向偏移一点,法线的x也相应的增加一点,就会出现下面这样的情况:



这种情况可以通过将法线的齐次坐标设置为0,来解决,因为偏移的原理就是矩阵最后一列的值乘以其次坐标产生的影响:

不等比缩放

大部分情况下,上面的处理就可以得到想要的效果了,但是,如果mv矩阵中存在不等比缩放,那么会出现法线与原来的面不垂直的问题,虽然在很多情况下这个效果可能不会太明显,因为法线偏差一点点,关照计算并不会有特别明显的区别:



但是当不等比缩放的不同轴之间的差距很大时,这个效果就会更明显了.像下面这样:



这个时候计算出来的光照就会和预期的有很明显的区别,给人很怪异的感觉了.

法线矩阵

这个时候,需要使用发现矩阵,其实就是模型矩阵逆矩阵的转置矩阵,用上效果立马就对了.

模型矩阵逆矩阵的转置矩阵作用原理

用法很简单,原理还是需要点时间来理解的.

首先我们的目标是法线最终需要与顶点的切线垂直.

定义:原法线为n,变换后法线为N,原来顶点处切线为t,变换后切线为T,模型矩阵为M,要计算的结果法线矩阵为X.

.表示点乘,表示矩阵乘以向量(也可以省略),或者向量间叉乘,`代表:

n . t = 0; //法线与切线垂直,所以点乘为0

N . T = 0; //最终结果亦垂直

N = X * n

T = M * t

将第三,四个方程带入第二个方程:

(X * n) . (M * t) = 0

点乘变换成叉乘

(X * n) . (M * t) => (X * n)T * (M * t) => 省略* => (Xn)T * Mt

=> nTXT * Mt

由于n . t = 0

XTM = I

n . t = N . T = 0

XTM = I => X = (M-1)T

OpenGL光照计算中法线矩阵原理及推到过程的更多相关文章

  1. OpenGL光照1:颜色和基础光照

    本文是个人学习记录,学习建议看教程 https://learnopengl-cn.github.io/ 非常感谢原作者JoeyDeVries和多为中文翻译者提供的优质教程 的内容为插入注释,可以先跳过 ...

  2. Deferred Shading,延迟渲染(提高渲染效率,减少多余光照计算)【转】

    Deferred Shading,看过<Gems2> 的应该都了解了.最近很火的星际2就是使用了Deferred Shading. 原帖位置:   http://blog.csdn.net ...

  3. OpenGL光照3:光源

    本文是个人学习记录,学习建议看教程 https://learnopengl-cn.github.io/ 非常感谢原作者JoeyDeVries和多为中文翻译者提供的优质教程 的内容为插入注释,可以先跳过 ...

  4. GLSL 中的光照计算

    理论知识转载地址:http://blog.csdn.net/ym19860303/article/details/25545933 1.Lambert模型(漫反射) 环境光: Iambdiff = K ...

  5. 关于opengl中的矩阵平移,矩阵旋转,推导过程理解 OpenGL计算机图形学的一些必要矩阵运算知识

    原文作者:aircraft 原文链接:https://www.cnblogs.com/DOMLX/p/12166896.html 为什么引入齐次坐标的变换矩阵可以表示平移呢? - Yu Mao的回答 ...

  6. OpenGL中的矩阵相乘

    OpenGL中的矩阵相乘 1, 在OpenGL中所有的视图变换,模型变换 都是4×4矩阵,每个后续的glMultiMatrix*(N),或者变换函数,glTranslate* (),glRotate* ...

  7. 043——VUE中组件之使用.sync修饰符与computed计算属性实现购物车原理

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. OpenGL光照2:材质和光照贴图

    本文是个人学习记录,学习建议看教程 https://learnopengl-cn.github.io/ 非常感谢原作者JoeyDeVries和多为中文翻译者提供的优质教程 的内容为插入注释,可以先跳过 ...

  9. OpenGL的glPushMatrix和glPopMatrix矩阵栈顶操作函数详解

    OpenGL中图形绘制后,往往需要一系列的变换来达到用户的目的,而这种变换实现的原理是又通过矩阵进行操作的.opengl中的变换一般包括视图变换.模型变换.投影变换等,在每次变换后,opengl将会呈 ...

随机推荐

  1. how to disabled alert function in javascript

    how to disabled alert function in javascript alert 阻塞主线程 default alert; // ƒ alert() { [native code] ...

  2. 一个最简单 node.js 命令行工具

    一个最简单 node.js 命令行工具 node.js cli $ node cli.js xyz # OR $ node cli xyz 接受参数 process.argv js "use ...

  3. css & background-image & full page width & background-size

    css & background-image & full page width & background-size https://css-tricks.com/perfec ...

  4. css delete line text & html del

    css delete line text & html del html <del>¥720</del> demo <span class="ticke ...

  5. 加州金融专访NGK,就NGK DeFi+展开讨论

    近日,加利福尼亚金融日报联合数家知名媒体就DeFi+行业专访了NGK团队代表特德惠斯基. 首先,加利福尼亚金融日报专栏记者迈尔斯表示,目前区块链领域,去中心化金融(DeFi+)的概念是目前市场上面最火 ...

  6. 「NGK每日快讯」12.15日NGK公链第42期官方快讯!

  7. 统一数据管理工具 —— CloudQuery v1.3.3 上线!

    前言 岁末临近,让我们跟随着新春的脚步,一起去看看 CloudQuery 今年最后一次更新吧! 新增功能 一.Oracle - 查看表结构 Oracle 数据源中,可查看各表结构信息(列详情和表注释等 ...

  8. Mac mini M1使用简单体验(编程、游戏、深度学习)

    好久不见了各位! 前一阵子忍不住剁手买了M1芯片的mac mini,为了弥补自己的内疚感就卖了自己的旧的mbp2017款.数据也完全迁移到了新机器上,之前的工作也就由mbp2017彻底换成mac mi ...

  9. JavaScript 模拟 sleep

    用 JS 实现沉睡几秒后再执行,有好几种方式,但都不完美,以下是我感觉比较好的一种方式 function sleep(time) { return new Promise((resolve) => ...

  10. CSS元素层级的概念及性质

    元素的层级的介绍 什么是元素的层级 通过z-index可以改变开启定位元素的层级 父元素的层级再高也不会遮盖住子元素 元素的层级的介绍 什么是元素的层级 当元素开启定位后就会是元素提升一个层级,网页是 ...