简单的图形学（一）

看到叶大的文章用JavaScript玩转计算机图形学(一)光线追踪入门 - Milo Yip - 博客园，里面有几个小例子，因此把这些效果用C++再实现一遍。

bajdcc/GameFramework，这一系列停更很久了，只是没想到比较有趣的点子，拿它来练习再好不过，缘由有：Direct2D渲染、支持lua脚本、C++编写。因为是光线追踪，因此实际上能够说不依赖任何库，只要有一个CPU就能完成计算。

目前只作了两个效果，具体的讲述移步博客，我再也不赘述。

代码：

• https://github.com/bajdcc/GameFramework/blob/master/CCGameFramework/base/pe2d/RenderSphere.cpp（光线追踪）
• https://github.com/bajdcc/GameFramework/blob/master/CCGameFramework/base/pe2d/PhysicsEngine2D.cpp#L73（色彩图）

色彩图

色彩图

这只是一个基本的例子，讲述如何经过像素操做来改变色彩。

咱们一张图就如同一个二阶矩阵，每一个颜色是一个int，就这么简单。

具体实现的过程：

1. 窗口收到WM_PAINT消息，开始启用Direct2D绘制
2. 咱们的窗口里面是树状关系的窗口/控件组，因此递归执行绘制操做
3. 展现控件执行绘制操做
4. 建立一个颜色数组，修改之
5. 根据数组建立一个位图，将它保存供重用
6. 利用Direct2D的渲染操做将该位图渲染

简单的光线追踪

光线追踪(左) 以及 法向量图(右)

左边的光线追踪我一开始也没有搞明白，等到实现以后才明白。

实现原理很简单：

1. 一个眼睛，一个球，没有光
2. 最终的结果要投影到一块屏幕上，屏幕和眼睛是有一个距离的，就像拍照时手要比个相框同样
3. 眼睛、屏幕、球，万事俱备（详见用JavaScript玩转计算机图形学(一)光线追踪入门 - Milo Yip - 博客园 第一张图）

最主要操做：

1. 屏幕上给每一个像素标记一个点
2. 眼睛与那些点造成一个射线（光线）
3. 射线无限延长（追踪），你把它当作激光
4. 激光有可能就照在了球上，也有可能不在球上
5. 对于照在球上的激光，我只要算一下激光出发点（眼睛）到激光结束点（激光与球交点）的距离便可。
6. 将二者距离（正数）最终映射到0-255，即RGB，根据RGB值肯定像素颜色
7. 若是激光没有打中球，对应像素表现为黑色

理一下映射关系：3D空间-->2D屏幕，距离-->像素颜色。

右边是一个法向量图，不一样的是：并不是由距离肯定像素颜色，而是由该点法向量肯定颜色。

激光打中球时，咱们计算出交点的坐标，同时也计算出激光到该点的直线，其实就是法向量。

法向量方程有四个参数，可是这里场景很简单——球的法向量（单位向量）通过球心，因此其实只有三个参数，咱们将三个参数（-1~1）映射到RGB。

后面要完成的：

1. 用JavaScript玩转计算机图形学(二)基本光源 - Milo Yip - 博客园
2. 用 C 语言画光（一）：基础
3. 用 C 语言画光（二）：构造实体几何

由https://zhuanlan.zhihu.com/p/30864679备份。