foupwang / JavaScript3DRenderer

Mini 3D renderer by javascript

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

JavaScript3DRenderer

Mini 3D Renderer by JavaScript (canvas version).

项目代码:https://github.com/foupwang/JavaScript3DRenderer

开发环境:VSCode+Chrome浏览器

参考:《Windows游戏编程大师技巧》(第2版) /《3D游戏编程大师技巧》(André LaMothe)

软件光栅化渲染器,是指用CPU(软件)实现GPU(硬件)绘图的功能。在现实环境中,因为OpenGL/Direct3D/游戏引擎的存在,我们基本接触不到光栅化过程中的细节,通过自己用纯代码实现光栅化,可以熟悉常用的图形算法,对渲染管线有更深刻的认识。

项目将将从一个最简单的画点函数开始,一小节一小节地实践怎么画一条直线,怎么填充三角形,怎么逐步加入背面剔除、深度测试、透视相机、着色器等高级功能。

本项目主要基于André LaMothe大神的名著《Windows游戏编程大师技巧》(第2版)《3D游戏编程大师技巧》,原书的C/C++代码,我改成了JavaScript实现,因为JavaScript运行环境简单,只要有浏览器即可。且无需任何编译,打开就能运行。

目录

1、JavaScript实现软件光栅化渲染器01-如何画点

2、JavaScript实现软件光栅化渲染器02-如何画直线

附录

1、Bresenham快速画直线算法(中文翻译+注释)

About

Mini 3D renderer by javascript


Languages

Language:JavaScript 93.1%Language:HTML 6.9%