如何使用texelFetch在着色器上不過濾使用一維紋理

Question

我想將一堆浮點數傳遞給片段着色器，並按索引訪問它們。

基本上在此答案中提到的1D Textures方法： 將值列表傳遞給片段着色器

我嘗試這樣：

javascript code

  gl.pixelStorei(gl.UNPACK_ALIGNMENT, 1);
  const data = new Uint8Array([
    255, 64, 192,
    0, 192, 0
  ]);

  let texture = gl.createTexture();
  gl.bindTexture(gl.TEXTURE_2D, texture);
  gl.texImage2D(gl.TEXTURE_2D,
                0,
                gl.R8,
                3,
                2,
                0,
                gl.RED,
                gl.UNSIGNED_BYTE,
                data);

    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);

  gl.activeTexture(gl.TEXTURE0);
  gl.bindTexture(gl.TEXTURE_2D, texture);

我在碎片着色器中訪問此制服：

uniform sampler2D u_texture;

void main() {    
  vec2 trans = texelFetch(u_texture, ivec2(0, 0), 0);
}

我使用glTexImage2D是因為我看到了一個例子，這部分起作用，但是有兩個問題：

我想擺脫所有過濾選項gl.texParameteri因為我不需要它們。 但是，如果我刪除那些，我不會得到數據。

此texelFetch方法返回[1，0]范圍內的值（例如：1表示255）。 為什么會這樣呢？

基本上我需要一個提到的方法的例子。

Answer 1

我想擺脫所有過濾選項gl.texParameteri，因為我不需要它們。 但是，如果我刪除那些，我不會得到數據。

紋理參數存儲在紋理對象中。 參數的初始值TEXTURE_MIN_FILTER是NEAREST_MIPMAP_LINEAR ，對於TEXTURE_MAG_FILTER它是LINEAR和TEXTURE_WRAP_S分別TEXTURE_WRAP_T它是REPEAT 。
如果需要不同的參數值，則必須為每個紋理對象顯式設置它們。 沒有辦法。

在你的情況下，問題是參數的初始值TEXTURE_MIN_FILTER （如上面提到它是NEAREST_MIPMAP_LINEAR ）。
如果縮小過濾器需要mipmap（不是NEAREST和LINEAR ），但是紋理沒有mipmap，則紋理不是“ mipmap complete”。
請注意，如果紋理不完整，則紋理提取的結果為（0，0，0，1）。 請參閱WebGL 2.0-5.12 Texel提取 。

---

此texelFetch方法返回[1，0]范圍內的值（例如：1表示255）。 為什么會這樣呢？

這是由於用於指定像素數據的像素格式（ gl.texImage2D ）引起的。

格式類型組合gl.RED ， gl.UNSIGNED_BYTE指定規范化整數格式。 整數數據類型的完整范圍被映射到無符號歸一化整數（例如UNSIGNED_BYTE ， UNSIGNED_SHORT ， UNSIGNED_INT ）的浮點范圍[0，1]，並被映射到有符號歸一化整數的范圍[-1，1]（例如BYTE ， SHORT ， INT ）。

---

在WebGL 2.0 （分別為OpenGL ES 3.0 ）中，可以通過gl.RED_INTEGER ， gl.UNSIGNED_BYTE組合指定圖像格式，該組合指定整數像素格式並對應於內部圖像格式R8UI （請參閱WebGl 2.0-3.7。 6個紋理對象 ）：

gl.texImage2D(gl.TEXTURE_2D,
              0,
              gl.R8UI,
              3,
              2,
              0,
              gl.RED_INTEGER,
              gl.UNSIGNED_BYTE,
              data);