3DSoftRenderer

研究了好几天基本的图形学，对于光栅化的大致过程有点了解了，很感谢网上的很多大牛的无私奉献，我就写一下这几天的总结，希望也能对网络上的知识做出一点点点的贡献。

屏幕有什么特点，无非是一排排的像素点，每个像素点只能用来显示一种颜色而已，所以可以理解为是一个表示颜色的二维数组。

如何在二维屏幕上显示3D世界，其实就是利用几何知识把3D坐标投影到2D坐标上。一个3D模型有很多顶点，把每个顶点投影到2D坐标上，保持原有的顶点连线，就是一个3D网格。具体的图形变换都是使用矩阵乘法来做的（有时也使用四元数表示旋转），具体的做法我就不说了。。

我们看到的3D世界也是通过颜色来辨别的，颜色就是纹理、材质、光照等叠加计算来的，不管怎么算，还是一个颜色而已。

所以我们要做的工作很明确了，就是修改一个初始化为背景色的二维颜色数组，使每个元素有各种颜色。

如何把这个二维颜色数组显示到我们的显示器上看一下呢，不同的平台有不同的做法，可以查看系统的API来了解。还可以把数组输出到一张图片（可以使用bmp、ppm等简单格式），使用图片浏览器打开查看。还可以使用html5的canvas绘制出来，使用浏览器查看。总之思路很简单。

我用js写了个html5的：https://github.com/Anti-Magic/3DSoftRenderer

其中的Device.js维护了一个二维颜色数组，Draw.js负责把颜色数组绘制到canvas上。除了Draw.js文件外，其他文件都是与html无关的，可以很容易的改写到其他平台上。