书目
大纲
- 概述
- 发展历史
- 基础概念
- 一个光栅化引擎，它可以根据你的代码绘制出点，线和三角形。
- 需要提供成对的方法，每对方法中一个叫顶点着色器， 另一个叫片断着色器。
- 着色器获取数据的4种方法
- 图元（primitives）
- 深度缓冲（Depth buffer 或者 Z-Buffer）
- 模板（stencil）
- 片段着色器精度
- 渲染管道(PipeLine)
- 顶点着色器（vertex shader）
- 图元组装（Primitives generation）
- 光栅化（rasterization）
- 片段着色器（fragment shader）
- 逐像素处理（per-fragment operations）
- 帧缓存（framebuffer）
- 二维运算
- 二维平移
- 二维旋转
- 二维缩放
- 二维投影
- 二维矩阵
- 三维投影
- 三维正射投影（orthographic）
- 三维透视投影（perspective）
- 三维相机
- 模型、视图、投影矩阵（MVP）
- 坐标系
- 本地坐标系(local coordinate system)
- 世界坐标系(world coordinate system)
- 观察坐标系(view coordinate system)
- 剪裁坐标系(clipping coordinate system)
- 光照
- 三维方向光源
- 三维点光源
- 三维聚光灯
- 阴影
- 几何
- 三维几何加工
- obj 文件加载
- 加载带 Mtl 的 Obj
- 图像处理
- 绘制图片需要使用纹理，渲染纹理时需要纹理坐标，而不是像素坐标。纹理坐标范围始终是 0.0 到 1.0 。
- 将图像上传到 gl 的纹理
- 在纹理上寻找对应颜色值
- 图像颜色通道修改
- 每个像素的值设置为与左右像素的均值
- 施加多种效果
- 纹理
- 三维纹理
- 数据纹理
- 渲染到纹理
- 跨域图像
- 纹理映射的透视纠正
- 平面的和透视的投影映射
- 文字
- HTML
- 二维Canvas
- 使用纹理
- 字形纹理
- 三维环境
- 立方体贴图
- 环境贴图
- 天空盒
- 蒙皮
- 雾
- 场景图
- 鼠标拾取
- Canvas
- clientWidth 和 clientHeight，返回的是画布在浏览器中实际显示的大小。
- 尺寸
- Retina 或 HD-DPI
- 动画
- requestAnimationFrame
- 其他
- 实例化绘制
- 多视角渲染
- 多画布渲染
- 透明渲染
- 代码规范
- 应用基本结构
- 命名约定
- GLSL 中的 undefined
- 实用工具
- 开发调试
- 状态调试工具（WebGL State Diagram）
- WebGL 引用表
- 测试
- 功能测试
- 性能测试
- 相关框架
- WebGL封装
- 渲染引擎
- 游戏引擎
- WebGL2
- 顶点数组对象始终可用
- 着色器中可以获取纹理大小
- 直接选取纹素
- 更多纹理格式
- 3D 纹理
- 纹理数组
- 非2的幂纹理支持
- 移除着色器循环限制
- GLSL中的矩阵函数
- 常见的压缩纹理
- Uniform 缓冲对象
- 深度纹理
下方为 xmind 脑图的线上分享，如果没加载出来需要等一会会。
