WebGL 关联属性和缓冲区对象

WebGL 关联属性和缓冲区对象

  顶点着色程序中的每个属性指向一个顶点缓冲对象,在创建顶点缓冲对象之后,程序员必须与顶点着色程序的属性相关联,每个属性指向只有一个顶点缓冲对象,它们从中提取数据值,然后这些属性被传递到着色程序。

  要将顶点缓冲对象与顶点着色程序的属性相关联,必须遵循下面给出的步骤:

  获取属性位置

  将属性指向顶点缓冲区对象。

  启用属性

获取属性位置

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

ulong getAttribLocation(Object program, string name)

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

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

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

  这里,shader_program是着色程序的对象,坐标是顶点Shader的属性。

将属性指向VBO

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

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

  这个方法接受六个参数,分别是:

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

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

  Type-它指定数据的类型。

  Normalized-这是一个布尔值。如果真,非浮动数据被标准化到[ 0 , 1 ] ;否则,它被归一化为[ -1 , 1]。

  Stride-它指定不同顶点数据元素之间的字节数,或零表示默认步长。

  Offset-它指定缓冲区对象中的偏移量(字节),以指示顶点数据的存储字节数。如果数据是从开始存储的,则偏移量为0。

  下面的代码片段展示了如何在程序中使用vertexAttribPointer():

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

启用属性

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

gl.enableVertexAttribArray(coordinatesVar);