髙小浪

前端中的数学知识

最近在学习webgl,看得很吃力,感叹学校里的数学知识都已经全还给老师。总结一下这几天恶补的数学知识,以免猴子搬苞谷。。。

矢量(vector)

矢量亦称向量。指一个同时具有大小和方向的几何对象,数学中相对于标量(只有大小)。

矢量有多种表示方法,比如:用起点A和终点B来表示;在三维直角坐标系Oxyz里可以用原点(0,0,0)到空间中任意一点表示一个向量。

单位矢量

矢量空间中的单位矢量就是长度为1的矢量。也就是为1的矢量。

基本矢量

三维直角坐标系中,基本矢量就是以横轴(Ox)、竖轴(Oy) 以及纵轴(Oz) 为方向的三个单位矢量。这三个矢量取好以后,其它的矢量就可以通过三元数组来表示,因为它们可以表示成一定倍数的三个基本矢量的总合。比如说一个标示为(2,1,3)的矢量就是2个矢量加上1个矢量加上3个矢量得到的矢量。

更多矢量相关知识参考:http://zh.wikipedia.org/wiki/%E7%9F%A2%E9%87%8F, 这里就不赘述了。

矩阵(Matrix)

数学上,一个m×n的矩阵是一个由m行n列元素排列成的矩形阵列。矩阵里的元素可以是数字、符号或数学式。以下是一个由6个数字符素构成的2行3列的矩阵:

矩阵的运算

矩阵的运算包括加(减),数乘,转置和乘法等。

加法: m * n 矩阵A和B的和(差):A±B为一个m×n矩阵,其中每个元素是A和B相应元素的和(差)

数乘:标量c与矩阵A的数乘:cA的每个元素是A的相应元素与c的乘积

转置:m * n 矩阵A的转置是一个n×m的矩阵,记为AT(有些书中也记为Atr 或tA、A’),其中的第i个行向量是原矩阵A的第i个列向量;或者说,转置矩阵AT第i行第j列的元素是原矩阵A第j行第i列的元素

下面着重讲下矩阵的乘法

两个矩阵的乘法仅当第一个矩阵A的列数和另一个矩阵B的行数相等时才能定义。如A是m * n矩阵和B是n * p矩阵,它们的乘积AB是一个m * p矩阵,它的一个元素

其中 1 ≤ i ≤ m, 1 ≤ j ≤ p

矩阵的乘法满足结合律和分配律,但是不满足交换律。

更多矩阵相关知识参考:http://zh.wikipedia.org/wiki/%E7%9F%A9%E9%98%B5

线性变换

中学的时候,我们学习了一元线性方程f(x) = kx,如果将他放到2维的坐标系中,它就是一条过原点的直线。现在我们从2维推广到n维

好像复杂了很多,它还能称之为线性方程吗?

现在我们就要运用上面讲到的向量和矩阵来表示n维线性方程,它的形式是b = Ax

A是一个m x n的矩阵,x是一个向量,你可能发现了,这和上面最简单的一元线性方程很像,这样初等线性函数和高等线性函数在形式上就统一起来了。

从几何上解释b = Ax就是:向量x经过线性变换后变成了向量b。换句话说我们可以用矩阵来表达线性变换,矩阵A就是这个线性变换的变换矩阵

那我们常见的线性变换有:

  • 旋转
  • 缩放
  • 平移(注意:平移本来不是线性变换,但我们可以用n+1维矩阵来表示)

我来看看在三维空间下,它们的变换矩阵分别是什么呢?

平移变换

大家下面看到的变换矩阵都是4 * 4的,主要原因是为了将平移和其他线性变换能够统一起来

缩放变换

局部比例变换的变换矩阵如下:

整体比例变换的变换矩阵如下:

旋转变换

三维旋转满足右手定则:大拇指指向围绕旋转的轴向,四指转的方向为正向。

绕z轴旋转

绕x轴旋转

绕y轴旋转

我们可以试着证明一下绕x轴的旋转变换矩阵:

例如:有一个向量v = (x, y, z), 现在我想让它绕x轴旋转Ɵ度,得到一个新得向量w。根据上面内容,我们应该用(x, y, z, 1)乘以Trx,根据矩阵乘法法则,得到的新向量w = (x, ycosƟ - zsinƟ, zcosƟ + ysinƟ)

我们用另外的思路推导一下,假设向量v的模为r,旋转前相对于x轴的角度为∂,那么旋转Ɵ度后,在y轴上的投影为r * cos(∂ + Ɵ),在z轴上的投影为r * sin(∂ + Ɵ),根据正弦余弦公式的推导

r * cos(∂ + Ɵ) = r * (cos∂cosƟ - sin∂sinƟ)

r * cos(∂ + Ɵ) = r * cos∂cosƟ - r * sin∂sinƟ

r * cos(∂ + Ɵ) = ycosƟ - zsinƟ

同理:

r * sin(∂ + Ɵ) = r * (sin∂cosƟ + cos∂sinƟ)

r * sin(∂ + Ɵ) = r * sin∂cosƟ + r * cos∂sinƟ
r * sin(∂ + Ɵ) = zcosƟ + ysinƟ

先写到。。。睡觉了