kirikayakazuto / toy-raster Goto Github PK

这是一个使用typescript编写的3D光栅化渲染器，核心渲染代码不超过1000行, 核心部分不会使用任何已有的图形引擎和任何硬件相关的接口。

大家可以使用这份代码进行图形学基础的学习, 也可以利用它自己写一些图形效果做一些调试。

目前支持的核心功能有

• 三角形光栅化
• 透视贴图
• 视锥裁剪
• 边缘剔除
• 深度缓冲
• 纹理双线性插值
• 2x2的MSAA
• 可灵活定制顶点着色/片元着色, 提供接口和vary插值列表

例子中支持的非核心功能:

• obj模型显示/png纹理读取
• 基本光照(blinn-phong)
• 通过鼠标缩放，旋转摄像机

后继计划：

• 支持切线空间的法线纹理
• 阴影
• mipmap

这个是一些渲染截图：

npm install

run

注意 ： 运行依赖模块主要是electron + typescript

执行tsc即可

1. 为什么使用typescript, 而不是常用的c++?

typescript更容易上手, 毕竟是学习用途, 不是为了真正商用, 不需要太多考虑性能上的问题。

2. 为什么不直接渲染出图片, 而是嵌入到网页上做实时渲染？

放到网页上做实时渲染确实更费事(需要把framebuffer当做贴图通过webgl的方式渲染到canvas上), 但是实时渲染可以方便做一些简单的人机交互（比如旋转摄像机）