在繪製之前綁定紋理（webgl）

我有2個紋理：

uniform sampler2D uSampler0; 
    uniform sampler2D uSampler1; 


    void main() { 
     vec4 color0 = texture2D(uSampler0, vTexCoord); 
     vec4 color1 = texture2D(uSampler1, vTexCoord); 
     gl_FragColor = color0 * color1; 
    }

和我的js代碼

gl.activeTexture(gl.TEXTURE0); 
    gl.bindTexture(gl.TEXTURE_2D,my_texture_ZERO); 
    gl.uniform1i(program.uSampler0,0); 

    gl.activeTexture(gl.TEXTURE1); 
    gl.bindTexture(gl.TEXTURE_2D,my_texture_ONE); 
    gl.uniform1i(program.uSampler1); 

    // uncomment one of the 3, it works. 
    // gl.bindTexture(gl.TEXTURE_2D, my_texture_ZERO); 
    // gl.bindTexture(gl.TEXTURE_2D, my_texture_ONE); 
    // gl.bindTexture(gl.TEXTURE_2D, texture_FOR_PURPOSE_ONLY); 

    gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);

gl.draw之前，我已經測試了3個綁定，每一件作品！

所以，我不明白真正的管道基礎。

感謝一些解釋

來源

2016-04-01 Philippe Oceangermanique

它的正常工作，因爲在提交代碼要發送的採樣適當的制服。

通過調用glActiveTexture（GL_TEXTURE0）將第一個紋理設置爲單元0，之後進行綁定。然後切換到unit1。

那時在每個單元中有兩個單獨的綁定紋理。

最後，這些單位作爲採樣器的制服被傳遞 - 這是如何指示哪個紋理應該在採樣器中：在這種情況下，將與GL_TEXTURE0單元相對應的0傳遞給第一個統一和類似的第二個統一。

可能即使沒有取消註釋這些行 - 事情應該工作。

來源

2016-04-01 08:52:09 spectre

好的，但它不工作，如果我做一個：'gl.bindTexture（gl.TEXTURE_2D，null）'，那麼綁定之前畫的立場？ –

綁定代表在活動單元中設置紋理。您之前通過調用glActiveTexture（GL_TEXTURE0）激活了單位0; 。正如你所猜測的 - GL_TEXTURE0表示0單位。之後，您通過調用glBindTexture來綁定紋理。如果你用null（或0是明確的）調用glBindTexture，你將從單元中移除紋理。另外請記住，您可以切換活動單位，但通過切換活動單位，您不會丟棄先前活動單位中的更改，因此紋理將停留在那裏。 – spectre

Okk ...並且如果在進行綁定之前沒有顯式活動單元，則默認情況下該綁定處理單元0。 –

此行是無效的

gl.uniform1i(program.uSampler1);

你不能傳遞一個值到採樣

方式WebGL的紋理單元的工作是他們內部的WebGL

gl.activeTexture全局狀態設置紋理單位所有其他紋理命令的效果。對於每個紋理單元，有2個綁定點，TEXTURE_2D和TEXTURE_CUBE_MAP。

你可以認爲它像這樣

gl = { 
    activeTextureUnit: 0, 
    textureUnits: [ 
    { TEXTURE_2D: null: TEXTURE_CUBE_MAP: null, }, 
    { TEXTURE_2D: null: TEXTURE_CUBE_MAP: null, }, 
    { TEXTURE_2D: null: TEXTURE_CUBE_MAP: null, }, 
    ... 
    ], 
};

gl.activeTexture只是做這個

gl.activeTexture = function(unit) { 
gl.activeTextureUnit = unit - gl.TEXTURE0; 
};

gl.bindTexture這是否

gl.bindTexture = function(bindPoint, texture) { 
    gl.textureUnits[gl.activeTextureUnit][bindPoint] = texture; 
};

gl.texImage2D和gl.texParamteri查找其質地喜歡的工作這

gl.texImage2D = function(bindPoint, .....) { 
    var texture = gl.textureUnits[gl.activeTextureUnit][bindPoint]; 
    // now do something with texture

換句話說，WebGL內部有一個全局的紋理單元陣列。 gl.activeTexture和gl.bindTexture操作該數組。

gl.texXXX本身操作紋理，但它們通過該數組間接引用紋理。

gl.uniform1i(someSamplerLocation, unitNumber)設置着色器的制服來查看該紋理單元陣列中的特定索引。

來源

2016-04-01 09:09:20 gman

太好了，我打算用它作爲「參考卡」！ –

在繪製之前綁定紋理（webgl）

回答

相關問題