关联属性和缓冲区对象

顶点着色器程序中的每个属性都指向一个顶点缓冲区对象。创建顶点缓冲区对象后，程序员必须将它们与顶点着色器程序的属性相关联。每个属性仅指向一个顶点缓冲区对象，从中提取数据值，然后将这些属性传递给着色器程序。

要将顶点缓冲区对象与顶点着色器程序的属性相关联，您必须遵循以下步骤 −

• 获取属性位置
• 将属性指向顶点缓冲区对象
• 启用属性

获取属性位置

WebGL 提供了一种名为 getAttribLocation() 的方法，该方法返回属性位置。其语法如下 −

ulong getAttribLocation(Object program, string name)

此方法接受顶点着色器程序对象和顶点着色器程序的属性值。

以下代码片段显示了如何使用此方法。

var coordinatesVar = gl.getAttribLocation(shader_program, "coordinates");

此处，shader_program 是着色器程序的对象，coordinates 是顶点着色器程序的属性。

将属性指向 VBO

为了将缓冲区对象分配给属性变量，WebGL 提供了一种名为 vertexAttribPointer() 的方法。以下是此方法的语法 −

void vertexAttribPointer(location, int size, enum type, bool normalized, long stride, long offset)

此方法接受六个参数，下面将进行讨论。

• Location − 它指定属性变量的存储位置。在此选项下，您必须传递 getAttribLocation() 方法返回的值。

• Size − 它指定缓冲区对象中每个顶点的组件数。

• Type −它指定数据的类型。

• Normalized − 这是一个布尔值。如果为 true，则非浮点数据被标准化为 [0, 1];否则，被标准化为 [-1, 1]。

• Stride − 它指定不同顶点数据元素之间的字节数，默认步长为零。

• Offset − 它指定缓冲区对象中的偏移量(以字节为单位)，以指示顶点数据从哪个字节存储。如果数据从头开始存储，则 offset 为 0。

以下代码片段显示了如何在程序中使用 vertexAttribPointer() −

gl.vertexAttribPointer(coordinatesVar, 3, gl.FLOAT, false, 0, 0);

启用属性

激活顶点着色器属性以访问顶点着色器中的缓冲区对象。对于此操作，WebGL 提供了 enableVertexAttribArray() 方法。此方法接受属性的位置作为参数。以下是在程序中使用此方法的方法 −

gl.enableVertexAttribArray(coordinatesVar);