了解WebGL 与 多媒体 | 青训营笔记

96 阅读2分钟

这是我参与「第四届青训营」笔记创作活动的的第20天,今天跟着月影老师学习WebGL,下面是这节课的一些个人小结:

基本概念

光栅:几乎所有的现代图形系统都是基于光栅来绘制图形的,光栅就是指构成图像的像素阵列; 像素:一个像素对应图像上的一个点,它通常保存图像上的某个具体位置的颜色等信息; 帧缓存:在绘图过程中,像素信息被存放于帧缓存中,帧缓存是一块内存地址; CPU:中央处理单元,负责逻辑计算; GPU:图形处理单元,负责图形计算;

WebGL创建步骤

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

两个重要着色器

Vertex Shader:顶点着色器,主要负责顶点的几何关系等的运算 Fragment Shader:片源着色器,负责片源颜色等的计算

图像基本概念

图像分辨率:用于确定组成一副图像的像素数据,就是指在水平和垂直方向上图像所具有的像素个数。

图像深度:图像深度是指存储每个像素所需要的比特数。图像深度决定了图像的每个像素可能的颜色值,或可能的灰度级数。

视频基本概念

分辨率:每个帧的图像分辨率

帧率:视频单位时间内包含的视频帧的数量

码率:就是指视频单位时间内传输的数据量,一般我们用kbps来表示,即千位每秒

总结

这两节课主要是对基本概念的理解还有一些基本的用法,想要熟练运用,实战上手则还需要继续研究。本次青训营到这旅程过半,很高兴能学了很多很多知识,认识到很多新朋友,慢慢的收获,感觉沉甸甸的,希望未来还有机会参加青训营,加油!!!