webGL编程指南总结

个人计算机上使用最广泛的两种三维图形渲染技术是Direct3D和OpenGL。

齐次坐标

由4个分量组成的矢量被称为齐次坐标，齐次坐标(x,y,z,w)等价于三维坐标(x/w,y/w,z/w)，所以如果齐次坐标的第4个分量是1，那么就可以将它当作三维坐标来使用。w的值必须是大于等于0的，如果w趋近于0，那么它所表示的点将趋近于无穷远，所以在齐次坐标系统中可以有无穷远的概念，齐次坐标的存在，使得矩阵乘法来描述顶点成为可能，三维图形系统中，通常使用齐次坐标来表示顶点的三维坐标。

着色器

顶点着色器

顶点着色器控制点的位置和大小

片元着色器

片元着色器控制点的颜色，简单的讲，片元就是显示在屏幕上的一个像素（严格意义上的来说，片元包括这个像素的位置、颜色和其他信息）。

一旦顶点着色器执行完后，片元着色器就会开始执行，调用main()函数。

坐标系统

三维坐标是笛卡尔坐标系统，具有X、Y、Z轴，通常，在webGL中，当你面向计算机，X轴方向是水平的(正方向是向右👉)，Y轴是垂直的(正方向是向下👇)，Z轴是垂直于屏幕的(正方向是向外)。这套坐标系又被称为右手坐标系，默认情况下WebGL使用右手坐标系，实际上WebGL既不是右手坐标系也不是左手坐标系。

attribute变量

我们的目标是将信息从JavaScript程序中传给顶点着色器，有两种方式可以做到:attribute变量和uniform变量。使用哪个变量取决于需要传输的数据本身，attribute变量传输的是那些与顶点相关的数据，而uniform变量传输的那些对于所有顶点都相同(或与顶点无关)的数据。关键词attribute被称为存储限定符