这是我参与【第五届青训营】笔记创作活动的第十四天

2023.02.14

webGL

什么是webGL

• GPU不等于WebGL不等于3D

• 现代图形系统：

  1. 轮廓提取

  2. 光栅化

  3. 帧缓存

  4. 渲染

  • 光栅：几乎所有的现代图形系统都是基于光栅来绘制图形的，光栅就是指构成图像的像素阵列
  • 像素：一个像素对应图像上的一个点，它通常保存图像上的某个具体位置的颜色等信息
  • 帧缓存：在绘图过程中，像素信息被存放于帧缓存中，帧缓存是一块内存地址
  • CPU：中央处理单元，负责逻辑计算
  • GPU：图形处理单元，负责图形计算
    • GPU由大量的小运算单元构成
    • 每个运算单元只负责处理很简单的计算
    • 每个运算单元彼此独立
    • 因此所有计算可以并行处理

• WebGL启动

  1. 创建WebGL上下文
  2. 创建WebGL Program
  3. 将数据存入缓冲区
  4. 将缓冲区数据读取到GPU
  5. GPU执行WebGL程序，输出结果

3D Matrix

3D标准模型的四个齐次矩阵（mat4）

1. 投影矩阵
2. 模型矩阵
3. 视图矩阵
4. 法向量矩阵