WebGL编程指南.阅读进度

1、第二章

　1.1、页数：28 (58 / 501)

　　GLSL ES 语言中，使用字符串拼接 然后传给 JS，没行字符串 以'\n'结束（但并不是必须的），“这是由于当着色器内部出错时，就能够获取出错的行号，这对于检查源代码中的错误很有帮助。”

　1.2、32 (62 / 501)：gl_Position（必须赋值）、gl_PointSize（默认值 1.0） 讲解。 GLSL ES ：强类型语言

　　32 (62 / 501)：WebGL内置函数vec4() --> 返回 4个浮点数组成的矢量。　　10.0 ≠ 10（前者 浮点类型，后者 整型）

　　33 (63 / 501)：齐次坐标：由4个分量组成的矢量。

　　　　　　　　　齐次坐标--> 4维的 --> 最后一个分量为 1.0，这个齐次坐标就可以表示“前3个分量为坐标值”的那个点

　　　　　　　　　齐次坐标 --> 能够提高处理3维数据的效率 --> 3维图形系统中被大量使用

　　　　　　　片元着色器：严格来讲 片元 包括这个像素的位置、颜色和其他信息（ZC：只见到了 颜色，未见别的信息啊???）

　　　　　　　gl_FragColor：片元着色器 唯一内置变量。vec4类型 RGBA格式（ZC：A是啥？记得在哪里看过是说 透明度，在前面？43 (73 / 501)有见到）

　　34 (64 / 501)： gl.drawArrays()-->强大的函数，可以绘制各种图形

　　　　　　mode(绘制方式)：gl.POINTS、

　　　　　　　　　　　　　　gl.LINES、gl.LINE_STRIP、gl.LINE_LOOP、

　　　　　　　　　　　　　　gl.TRIANGLES、gl.TRIANGLE_STRIP、gl.TRIANGLE_FAN

　　35 (65 / 501)： WebGL坐标系统：三维坐标系统、笛卡尔坐标系、右手坐标系(WebGL默认坐标系，也可以使用别的坐标系) （ZC：这里 关于 Y轴的正方向 貌似有点前后不一致啊...）

　　38 (68 / 501)：与 OpenGL 相比，没有 交换颜色缓冲区的代码。（WebGL 不需要这个）

　　　　GLSL ES变量：attribute变量（必须声明成全局变量）、uniform变量　　40 (70 / 501) 存储限定符

　　39 (69 / 501)：使用 attribute变量 3个步骤

　　40 (70 / 501)：attribute变量 : a_???、uniform变量 : u_???

　　　　程序对象(program object) --> gl.program（必须在 初始化 着色器 之后使用，∵ 在初始化着色器 过程中 创建了这个 程序对象）

　　42 (72 / 501)：向attribute变量赋值，gl.vertexAttrib3f(location, v0, v1, v2)

　　44 (74 / 501)：gl.vertexAttrib3f() 的同族函数

　　　　gl.vertexAttrib1f( location, v0 )：第2、3个分量设为 0.0，第4个分量被设为1.0

　　　　gl.vertexAttrib2f( location, v0, v1 )：第3个分量设为 0.0，第4个分量被设为1.0

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

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

 

　　　　gl.vertexAttrib[1234]f

 

　　　　var position = new Float32Array( [1.0, 2.0, 3.0, 1.0] );

　　　　gl.vertexAttrib4fv( a_Position, position ); // 这里的数字，真正含义是attribute矢量中的元素个数（ZC：数值上 等于 数组的元素个数）

　　　　WebGL 相关函数的命名规范，遵循 OpenGL ES 2.0

　　　　　　函数名后面跟v，表示函数也可以接受数组作为参数。

　　46 (76 / 501)：通过鼠标点击绘点　　　　ClickedPoint

　　48 (78 / 501)：匿名函数 的机制 来设置 事件响应函数

　　　　好处：49 (79 / 501) 访问 局部变量。最灵活的事件响应方式，而且能够避免使用全局变量（全局变量应尽量避免使用） ZC：为何 要尽量避免使用全局变量？本书貌似没看到明说的地方，不知会不会有讲JS的书讲解这一点？

 

　　52 (82 / 501)：WebGL中 轴的坐标区间为从 -1.0 到 1.0...　　ZC：看到 图2.27[ 51 (81 / 501) ]中，x轴 y轴 的区间 都是 -1.0到1.0，为什么？就是这么规定的？如果 <canvas/>的width和height不是 1:1，WebGL的 坐标区间还是 从 -1.0 到 1.0？？

　　53 (83 / 501)：颜色缓冲区 的默认机制 --> 颜色缓冲区重置 --> 内容全部丢失 --> 需要记录下所有的鼠标点击的点的位置。　　下一章（第3章）详细谈论

　　　　ZC：这里的“重新绘制”，是指 调用 函数gl.drawArrays(..)吗？总要有个函数调用一下 让WebGL知道我们绘制完了，不然WebGL怎么知道 什么时候 才是我们绘制结束的时候？

　　　　ZC：这里 绘制所有的鼠标点击的点 的时候，是通过 将所有的点的坐标 一股脑的全部写进去 的方式来操作的？能不能使用  一个一个将点的坐标添加进去的方式（①一个一个的添加到图形中 ②一个一个的添加到 定点着色器）？ [ 书中就是 一个一个写到着色器里面去的，然后貌似也是 ]

　　54 (84 / 501)：这里是 不清空<canvas/>，然后 一个一个设置顶点着色器然后绘制点的实验

　　55 (85 / 501)：ColoredPoints　　uniform变量

　　57 (87 / 501)：ZC：uniform变量 不是全局的吗？ 怎么可以用于 片元着色器？难道是∵ 每次绘制点的颜色的时候 都重新设置了 uniform变量 的缘故？

　　58 (88 / 501)：只有 定点着色器 才能使用 attribute变量（ZC：! ! !），使用片元着色器时 你就需要使用 uniform变量。或者 你可以使用 varying变量。（比较复杂 第5章之前不会使用它）

　　　　在 GLSL ES中，只能指定 float类型的 attribute变量，可以指定 任意类型的 uniform变量。（详见 第6章）

　　59 (89 / 501)：精度限定词（precision qualifier），指定变量的范围(最大值和最小值)和精度。第5章详细讨论精度问题。

　　　　gl.getUniformLocation(.., ..)　　返回值 与 gl.getAttribLocation(...) 有不同之处(-1)

　　60 (90 / 501)：gl.uniform4f(...)

　　61 (91 / 501)：gl.uniform4f(...) 同族函数

2、

3、

4、

5、