WebGL方法 gl.drawArrays 既强大又灵活,通过第一个参数指定不同的值,可以以7种不同的方式来绘制图形。下面将对这个方法进行详细的解释说明。
下面中的v0,v1,v2等表示缓冲区中的顶点,顶点的顺序将会影响绘制的结果
gl.drawArrays(mode, first, count);有三个参数
mode
表示 绘制图形的模式,有下面7个选项
gl.POINTS表示绘制一系列的点,分别绘制在v0,v1,v2处gl.LINES表示绘制一系列单独的线段,分别绘制在(v0,v1),(v2,v3),(v4,v5)...gl.LINE_STRIP表示绘制一系列连续的线段,(v0,v1),(v1,v2),(v2,v3)...gl.LINE_LOOP表示绘制一个闭环的线段,(v0,v1),(v1,v2),(v2,v3)...(vn,v0)gl.TRIANGLES表示绘制一系列单独的三角形,三角形的三个点分别是(v0,v1,v2),(v3,v4,v5)...gl.TRIANGLE_STRIP表示绘制一系列相连接的三角形(v0,v1,v2),(v2,v1,v3),(v2,v3,v4)...(注意点的顺序保持一致)gl.TRIANGLE_FAN表示绘制一个以v0为圆心的扇形(v0,v1,v2),(v0,v2,v3),(v0,v3,v4)...
下图为各种模式下绘制的基本图形
first
指定从哪个顶点开始绘制,这个参数决定了上面v0,v1,v2的调用起点,假如first值为1,则从v1开始往后算。
count
指定绘制需要用到多少个顶点,即有多少个顶点参与绘制,多余的会被忽略。