[WebGL Primer] Nine, the basis for vertex caching

Note: The article is translated from http://wgld.org/, the original author Sambonja 広 (doxas), the article if there is my additional instructions, I will add [Lufy:], in addition, The WEBGL research is not deep enough, some professional words, if the translation is wrong, you are welcome to correct.

Local coordinates

With WebGL you can draw a wide variety of 3D models, and you can also draw points and lines, deciding what is required to draw vertices.
Without vertices, there will be no polygons, because there is no way to draw points and lines. Therefore, the programming of WebGL must deal with vertex intelligence. Also, there is the information that must be included in the vertex, which is the position coordinates of the vertex.
Since vertex position coordinates are required, how do you define this information?
When the vertices are finally drawn on the screen, they have to pass the model coordinate transformation, the view coordinate transformation and the projection coordinate transformation, which has been said many times. However, before using coordinate intelligence, you must first define the composition of these vertex groups, otherwise there is no way to start.
Where the fixed-point group is placed, it behaves as a coordinate, which is generally called the local coordinate. Local coordinates are the coordinates of each vertex of the model relative to the origin (x, y, Z, 0).
For example, a local coordinate is a vertex (1.0,0.0,0.0), and the x-axis distance from the origin is 1.0. Similarly, each vertex defines the local coordinates in turn, so that the vertex position is formed.

information to save vertices

The local coordinates of these vertices must be transformed in the WEBGL program and then passed to the vertex shader. In WebGL, in order to process the information for these vertices and save the vertex information, you need to use the vertex cache.
Cache (buffer) is a general computer term that represents the storage space for data. There are various caches in WebGL, such as frame caching, index caching, and so on, but regardless of the cache, you just need to think of it as a space to hold the data together. Vertex caching is one of those, which is used to hold vertex information, and the vertex cache in WebGL is called VBO (vertex buffer object).


the vertex cache must be, and is not uniqueVertex caching is not only the location where vertices are saved, but also the vertex-related information that is stored in the vertex cache.
For example, all vertex-related information, such as vertex normals, colors, and arts and sciences coordinates, can be saved and managed using vertex caching. However, it is important to note that when appending information to vertex information, you need to use the corresponding VBO.


vertex Caching and attributein the last article, we have introduced the mechanism of the vertex shader receiving data, the variable defined by the attribute modifier.
In fact, it is VBO to assume the task of passing data to this attribute variable. In the WEBGL program, the vertex information is saved to VBO, and then the shader is notified which VBO is related to which attribute variable, and the vertex shader can handle the vertices correctly.
Based on the preceding content, the specific process for vertex cache related processing is as follows.
? The various information of the vertex is saved in the array
? using WebGL method to generate VBO
? Use the WebGL method to pass the information in the array to Vbo
? The attribute function in the vertex shader is combined with the VBO
VBO generation process, first of all, the data must be saved to the array initially, because the vertex information (position) must have X, Y, z, so the length of the array must be the number of vertices X3, this time need to note that arrays can not use multidimensional arrays, VBO generation need to use a one-dimensional array.
Once the array of vertex information is ready to be saved, the VBO is generated using the WebGL context method, which, of course, is generated when the Vbo is empty, and then the array of vertex information is passed to it.
Then, for example, the attribute function in the vertex shader is associated with the VBO. It also said that the VBO is not only a kind of information, the location of information outside the normal and color, such as the presence of the appropriate VBO, and then notify the WEBGL which VBO and which attribute variable associated.


SummaryIn this way, the vertex cache should understand.
The programmer is free to decide what information is added to the vertex, there is a mechanism called [flexible vertex format] in DirectX, the vertex format is not in WebGL, and the programmer has to handle all the vertex information on its own.
Just add the vertex information you want to add the Vbo on the line, Vbo generation method and how to pass the array information to VBO, and so on, later in the article will be described in detail. First, take a look at the approximate process.
The most difficult to understand is how to attribute variables associated, this will certainly be introduced in detail later. This time, you just need to understand that the role of vertex caching is sufficient.


next time, talk about the coordinate transformation of the matrix can not be missing the calculation method, after the completion of these, you can draw polygons on the screen, look forward to it.

reprint Please specify:Turn from Lufy_legend's blog Http://blog.csdn.net/lufy_legend