可视化学习笔记关于线性代数，在学习这个栏目《跟月影学可视化》之前我还只停留在怎样计算行列式、各种矩阵变换上，涉及到的

数学基础

关于线性代数，在学习这个栏目 《跟月影学可视化》 之前我还只停留在怎样计算行列式、各种矩阵变换上，涉及到的概念总是找不到现实的落脚点。当线代和图形学结合起来，我终于发现这些知识原来早已暗藏在代码的角角落落。

假设2个向量a、b，分别为a = [a1, a2, …an]，b = [b1, b2, …bn]，向量的点乘结果为：

a•b = a1*b1 + a2*b2 + ... + an*bn 

//对于2维向量，其中θ为向量夹角
a•b = |a||b|cosθ

几何意义：a 向量乘以 b 向量在 a 向量上的投影

物理意义：相当于 a 力作用于物体，产生 b 位移所做的功

应用：

判断平行性：两向量垂直时，即角度θ为90，点积为0；两向量平行时，即角度θ为0，点积为|a|•|b|(a、b的长度)。由此可以判断，点积越大，平行性越好（夹角在0-90°时）

假设2个三维向量 a(x1, y1, z1) 和 b(x2,yx2,zx2)，向量的叉乘结果为：

如果a 和 b是二位向量，则

几何意义：三维几何中，向量a和向量b的叉乘结果是一个向量，更为熟知的叫法是法向量，该向量垂直于a和b向量构成的平面；二维空间中，叉乘所得向量的模就是向量a和向量b构成的平行四边形的面积

物理意义：二维空间中，叉乘表示a 和 b的力矩

应用：

“线性变换 + 平移”，其中线性变换包括缩放和旋转灯。css中的transform就是仿射变换

缩放的矩阵公式：

旋转的矩阵公式：

css中的transform:

div.block {
  transform: rotate(30deg) translate(100px,50px) scale(1.5);
  <!--transform: matrix(1.3,0.75,-0.75,1.3,61.6,93.3)；-->
}

换算成矩阵公式为：

像素化，就是把一个图像看成是由一组像素点组合而成的。例如Canvas2D 以 4 个通道来存放每个像素点的颜色信息，每个通道是 8 个比特位，也就是 0~255 的十进制数值，4 个通道对应 RGBA 颜色的四个值。

像素处理实际上就是为了达到特定的视觉效果，用程序来处理图像上每个像素点。