WebGL關聯屬性和緩衝區物件

在頂點著色器程式中的每個屬性點為頂點緩衝區物件。建立頂點緩衝區物件之後，程式員必須將它們與頂點著色器程式的屬性相關聯。每個屬性點只有一個頂點緩衝物件，從它們中提取資料值，然後將這些屬性傳遞給著色器程式。

到了頂點緩衝物件的頂點著色器程式的屬性聯絡起來，必須按照下面的步驟 -

獲取屬性的位置

WebGL提供一種方法 getAttribLocation()，它返回屬性的位置。它的語法如下-

ulong getAttribLocation(Object program, string name)

此方法接受頂點著色器的程式物件和頂點著色器程式的屬性值。

下面的程式碼片段展示了如何使用此方法。

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

這裡，shader_program是著色器程式物件和坐標是頂點著色器程式的屬性。

要分配緩衝物件的屬性變數，WebGL提供了一個名為vertexAttribTutorialser()的方法。下面是該方法的語法-

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

此方法接受六個引數，它們討論下面。

Location ? 它指定一個屬性變數的儲存位置。根據這個方案，必須通過由getAttribLocation()方法返回的值
Size ? 它指定在緩衝物件每頂點部件的數量
Type ? 它指定資料的型別
Normalized ? 這是一個布林值。如果為真，非浮動資料被歸一化到[0,1]。否則，它被歸一化到[-1,1]。
Stride ? 它指定不同頂點資料元素之間的位元組數，或預設為零步幅。
Offset ? 它指定在緩衝器物件，以指示資料從頂點的哪個儲存位元組偏移(位元組)。如果資料是從開始(beginning)儲存的，偏移量(offset)為0。

下面的片段展示了如何在程式中使用 vertexAttribTutorialser() -

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

啟用頂點著色器屬性來存取緩衝物件的頂點著色器。對於該操作，WebGL 提供 enableVertexAttribArray()方法。這個方法接受屬性作為引數位置。以下是如何在程式中使用此方法-

gl.enableVertexAttribArray(coordinatesVar);