WebGLRenderingContext: getUniformLocation() 方法

Baseline 已廣泛支援

此特性已相當成熟,可在許多裝置和瀏覽器版本上使用。自 ⁨2015 年 7 月⁩以來,各瀏覽器均已提供此特性。

注意:此功能在 Web Workers 中可用。

作為 WebGL API 的一部分,WebGLRenderingContextgetUniformLocation() 方法返回給定 WebGLProgram 中特定 **uniform** 變數的位置。

uniform 變數以 WebGLUniformLocation 物件的形式返回,它是一個不透明的識別符號,用於指定 uniform 變數在 GPU 記憶體中的位置。

一旦獲得 uniform 的位置,您就可以使用其他 uniform 訪問方法之一來訪問 uniform 本身,並將 uniform 位置作為輸入之一傳入。

getUniform()

返回給定位置的 uniform 的值。

WebGLRenderingContext.uniform[1234][fi][v]()

將 uniform 的值設定為指定值,該值可以是單個浮點數或整數,也可以是 2-4 分量的向量,可以作為值列表或 Float32ArrayInt32Array 指定。

WebGLRenderingContext.uniformMatrix[234][fv]()

將 uniform 的值設定為指定的矩陣,可能帶有轉置。該值表示為 GLfloat 值序列或 Float32Array

uniform 本身使用 GLSL 在著色器程式中宣告。

語法

js
getUniformLocation(program, name)

引數

program

要從中查詢指定 uniform 變數的 WebGLProgram

name

一個字串,指定要返回其位置的 uniform 變數的名稱。名稱中不能包含任何空格,並且不能使用此函式來獲取任何以保留字串 "gl_" 開頭的 uniform 的位置,因為那些是 WebGL 層內部使用的。

可能的值對應於 getActiveUniform 返回的 uniform 名稱;有關宣告的 uniform 如何對映到 uniform 位置名稱的詳細資訊,請參閱該函式。

此外,對於宣告為陣列的 uniform,以下名稱也有效:

  • 不帶 [0] 字尾的 uniform 名稱。例如,為 arrayUniform 返回的位置等同於為 arrayUniform[0] 返回的位置。
  • 帶整數索引的 uniform 名稱。例如,為 arrayUniform[2] 返回的位置將直接指向 arrayUniform uniform 的第三個條目。

返回值

一個 WebGLUniformLocation 值,指示命名變數的位置(如果存在)。如果指定的變數不存在,則返回 null

WebGLUniformLocation 是一個不透明的值,用於唯一標識 uniform 變數在 GPU 記憶體中的位置。有了這個值,您就可以呼叫其他 WebGL 方法來訪問 uniform 變數的值。

注意: WebGLUniformLocation 型別在指定 uniform 屬性的索引或位置時與 GLint 型別相容。

錯誤

可能發生以下錯誤;要檢查 getUniformLocation() 返回後的錯誤,請呼叫 getError()

GL_INVALID_VALUE

program 引數不是 WebGL 生成的值或物件。

GL_INVALID_OPERATION

program 引數不對應 WebGL 生成的 GLSL 程式,或者指定的程式尚未成功連結。

示例

在此示例中,取自文章 A basic 2D WebGL animation exampleanimateScene() 方法,它從著色程式獲取三個 uniform 的位置,然後設定每個 uniform 的值。

js
gl.useProgram(shaderProgram);

uScalingFactor = gl.getUniformLocation(shaderProgram, "uScalingFactor");
uGlobalColor = gl.getUniformLocation(shaderProgram, "uGlobalColor");
uRotationVector = gl.getUniformLocation(shaderProgram, "uRotationVector");

gl.uniform2fv(uScalingFactor, currentScale);
gl.uniform2fv(uRotationVector, currentRotation);
gl.uniform4fv(uGlobalColor, [0.1, 0.7, 0.2, 1.0]);

注意: 此程式碼片段取自“A basic 2D WebGL animation example”中的 animateScene() 函式。請參閱該文章以獲取完整的示例,並檢視實際的動畫效果。

將當前著色程式設定為 shaderProgram 後,此程式碼會獲取三個 uniform "uScalingFactor""uGlobalColor""uRotationVector",每次呼叫 getUniformLocation() 獲取一個 uniform。

然後設定這三個 uniform 的值

  • uScalingFactor uniform — 一個 2 分量的頂點 — 從變數 currentScale 接收水平和垂直縮放因子。
  • uniform uRotationVector 被設定為變數 currentRotation 的內容。這同樣是一個 2 分量的頂點。
  • 最後,uniform uGlobalColor 被設定為顏色 [0.1, 0.7, 0.2, 1.0],此 4 分量向量中的分量分別代表紅色、綠色、藍色和 alpha 的值。

完成此操作後,下一次呼叫著色函式時,它們各自名為 uScalingFactoruGlobalColoruRotationVector 的變數都將具有 JavaScript 程式碼提供的值。

規範

規範
WebGL 規範
# 5.14.10

瀏覽器相容性

另見