WebGL学习记录(三)

本来这个学习记录系列, 至少入门篇打算写个10来篇系列, 没想到几杯咖啡下肚已经入门了。
这期间主要学习了纹理贴图、GLSL着色器语言,学完之后已经能看懂以前使用过的别人家写的shader了。

WebGL学习记录(三)

纹理贴图

涉及元素:
  • sampler2D 用于传递外部纹理数据,以及配合texture2D进行像素获取采样
  • texture2D 根据纹理坐标获取像素颜色
  • blend 颜色融合,通过blendFunc设定源颜色和目标颜色的混合方式

GLSL着色器语言

感觉语法和c语言几乎一样,不过api大多偏向几何与空间向量计算。

涉及重要元素:
  • 内置变量 gl_Position、gl_FragColor、gl_FragCoord...
  • struct结构体 定义复合数据结构
  • 内置函数 三角函数,向量计算
  • 预处理 主要是宏相关

看完以上知识,一般来说可以编写与理解简单的shader特效了;
如果还需要提升就需要继续深入了,深入的方式除了关注webgl大牛博客继续学习, 还有就是直接找到使用环境,比如使用WebGL的相关游戏公司就比较好了;
毕竟想要快速进步,工作实践还是很重要的;

另外渲染流程又有了新的认识:


这个学习记录系列还会继续,但是并不会每篇文章都长篇大论, 主要是划重点。重点有了,学习才有目的性,才能高效。