The WebGL method gl.drawarrays is both powerful and flexible, drawing graphics in seven different ways by specifying different values as the first parameter. This method is explained in detail below.
V0,v1,v2, etc. below represent the vertices in the buffer. The order of vertices will affect the result of the drawing
gl.drawArrays(mode, first, count); There are three parameters
mode
Represents the mode for drawing graphics, with the following 7 options
gl.POINTS
It means to plot a series of points at v0,v1, and v2gl.LINES
Represents to draw a series of separate line segments at (v0,v1),(v2,v3),(V4, V5)…gl.LINE_STRIP
Draw a series of consecutive line segments,(v0,v1),(v1,v2),(v2,v3)…gl.LINE_LOOP
Represents to draw a closed-loop line segment,(v0,v1),(v1,v2),(v2,v3)… (vn,v0)gl.TRIANGLES
Draw a series of separate triangles, the three points of which are (v0,v1,v2),(v3, V4, V5)…gl.TRIANGLE_STRIP
Draw a series of connected triangles (v0,v1,v2),(v2,v1,v3),(v2,v3, V4)… (Keep the order of the points the same.)gl.TRIANGLE_FAN
Said to draw a fan of the centered on where v0 (where v0, v1, v2), (where v0, v2 and v3), (where v0, v3, v4)…
Below is the basic graph drawn in various modes
first
Specifies the vertex from which to draw. This parameter determines the starting point of calls to v0,v1, and v2 above. If first is 1, v1 starts from v1.
count
Specifies how many vertices will be used to draw, that is, how many vertices will be used to draw, any excess will be ignored.