webgl 光照

• 前言 现实世界中被光线照射时,会发射一部分光.只有当反射光线进入你的眼睛时,你才能看到物体,并且分辨出它的颜色.
• 根据光源和光线的方向,物体不同表面的明暗程度变的不一样
• 根据光源和光线的方向,物体向地面投下影子

光源的类型

光主要分为两大类型:平行光和点光源.平行光类似太阳光.点光源类似人造灯.此外还用环境光来模拟真实世界的非直射光(也就是由光源发出后经过墙壁或者其他物体反射后的光)

• 平行光: 平行光的光线是相互平行的,平行光具有方向.平行光可以看做是无限远的光源发出的光.平行光比较简单,可以使用一个颜色和一个方向来定义它
• 点光源: 点光源是从一个点向周围的所有方向发出的光,我们需要指定光源的位置和颜色
• 环境光: 环境光是指那些经光源发出后,被墙壁等物体多次反射,然后照到物体表面的光.

反射类型

物体向哪个方向反射光,反射光的延时是什么?取决以下两个因素:入射光和物体表面的类型.入射光的信息包括入射光的颜色和方向,而物体表面信息包括表面的固有颜色和反射特性.
物体表面反射光线的方式有两种:漫反射和环境反射

漫反射

漫反射是针对平行光或者点光源而言的.漫反射的反射光在各个方向是均匀的,

image.png

在漫反射中,反射光的颜色取决于入射光的颜色 表面的基底色 入射光与表面形成的入射角.我们将入射角定义为入射光与表面的法向量形成的夹角.
<漫反射光颜色> = <入射光颜色> X<表面基底色> x cosø

环境反射

环境反射是针对环境光而言的.在环境反射中,反射光的方向认为就是入射光的反方向.由于环境关照射物体的方式就是各方向均匀,强度相等,所以反射光也是各个方向均匀
<环境反射光颜色>= <入射光颜色>x<表面基底色>

image.png

当漫反射和环境发射同时存在时,将两者加起来,就会得到最终被观察到的颜色
<表面的反射光颜色> = <蛮反射光颜色>x<环境反射光颜色>

平行光下的漫反射

漫反射的反射光其颜色与光在入射光在入射角ø有关.平行光入射产生的漫反射的颜色比较好计算.漫反射反射关颜色
<漫反射光颜色> = <入射光颜色> x<表面基底色> x cosø
在 3D 建模的时候,我们并不会直接给出入射角是多少,我们必须根据入射光的方向和物体表面的朝向来计算入射角.在 3D 建模的时候,我们可以确定每个表面的朝向,子啊指定光源的时候,在确定光的方向,根据这两个矢量的点积,来计算两个矢量的夹角余弦.点击运算已经内置在 GLSL ES 中了(dot)
cosø = <光线方向>点积<法向量>
因漫反射公式可以写成
<漫反射光颜色> =<入射光颜色> x <表面基底色> x (<光线方向>点积<法向量>)
这里需要注意的:其一 光线方向矢量和表面法向量矢量长度必须为 1,否则反射光的颜色就会过暗或者过亮.将一个矢量长度调整为 1,同时保证方向不变的过程叫做归一化.其二,这里所谓的光方向,实际上是入射方向的反方向.

image.png

法线:表面的朝向

物体表面的朝向,即垂直于表面的方向.又称为法线或者法向量
.平面的法向量是唯一的,与位置无光

运动物体的关照效果

坐标的变换引起法向量的变化

• 平移不会引起法向量的变化
• 旋转会改变法向量
• 缩放变换也会引起法向量的变化

魔法矩阵

对顶点进行变换的矩阵称为模型矩阵.对于如何计算变换之后的法向量?我们只需要将变换之前的法向量乘以模型矩阵的逆转矩阵即可.逆矩阵的含义是,如果矩阵 M 的逆矩阵的 R,那么 RM或者 MR 都是单位矩阵
TREE 封装了两个方法对矩阵进行操作
Matrix4*setInverseof(m) 使自身称为逆矩阵
Matrix4.transpose:对自身进行逆矩阵