WebGL编程指南读书笔记 | 第二章 WebGL入门

getrWebGLContext() 获取上下文

gl.clearColor() 指定绘图区域背景色 R，G，B，A

gl.clear(buffer) 将缓冲区设定为预定的值，颜色、深度、模板缓冲区

 

着色器（shader）

WebGL有两种着色器：

顶点着色器（Vertex shader） 用来描述顶点特性（位置、颜色）的程序

顶点（Vertex）指二维或三维空间中的点

片元着色器（Fragment shader）进行逐片元处理过程

片元（fragment） 像素 图像的单元

顶点着色器指定点的位置和尺寸 片元着色器指定点的颜色

initShader(gl, vshader, fshader) 在WebGL系统内部建立和初始化着色器

齐次坐标 提高处理三维数据的效率(x,y,z,w)等价于(x/w,y/w,z/w) w的值大于等于0

gl.FragColor 内置变量 指定片元颜色

 

WebGL的坐标系统

右手坐标系

canvas坐标

中心点(0,0,0)

上下左右边缘分别为1

 

attribute 存储限定符 数据从着色器外部传入给该对象 attribute vec4 a_Position 

获取attribute变量的存储位置：

gl.getAttribLocation(gl.program,name)

程序对象，包括顶点着色器和片元着色器

向attribute变量传值

gl.vertexAttrib3f(location,v0,v1,v2);

同族函数：

gl.vertexAttrib1f(location, v0)

gl.vertexAttrib2f(location, v0, v1)

gl.vertexAttrib3f(location, v0, v1, v2)

gl.vertexAttrib4f(location, v0, v1, v2, v3)

默认值为0

gl.vertexAttrib4fv()

uniform变量 用于从JS程序中向顶点着色器和片元着色器传输一致的数据

precision qualifier 精度限定词 指定变量的范围（最大值和最小值）和精度 第五章详细讨论

gl.getUniformLocation()获取指定名称的uniform变量的存储地址

gl.uniform1f()

gl.uniform2f()

gl.uniform3f()

gl.uniform4f()

 

 

 

 

 

 

 

 

 

 

 

来源：oschina

链接：https://my.oschina.net/u/3854991/blog/3078619