webgl - 重新使用纹理单元来处理不同纹理类型的 chrome 中断

Question

查看以下测试：

http://binks.knobbits.org/webgl/texture3.html

这是对立方体纹理的简单测试。它还具有 2D 纹理，可以很好地衡量。

我发现在某些浏览器（到目前为止，chrome）中，如果我重新使用与 2D 纹理相同的纹理单元来绘制立方体纹理，则图像无法正确显示。

底部有一个复选框，标记为“为球体上的立方体纹理和地板上的 2D 纹理使用单独的纹理单元”，显示了这一点。

这是 chrome 还是我的代码中的错误？

Answer 1

我看不出你的代码有什么问题，但是

1）您不能对 2 个不同的目标使用相同的纹理。换句话说，你不能这样做

tex = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, tex);
gl.bindTexture(gl.TEXTURE_CUBE_MAP, tex);

2) 您不能同时在纹理单元上使用 TEXTURE_2D 和 CUBE_MAP。

您可以同时分配两者，但在渲染时，您只能在着色器中引用其中之一。换句话说。

gl.activeTexture(gl.TEXTURE0);
tex1 = gl.createTexture();
tex2 = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, tex1);
gl.bindTexture(gl.TEXTURE_CUBE_MAP, tex2);

没关系，但是尝试使用纹理单元 0 中的两种纹理的着色器会失败。

Answer 2

我已经订购了一些绘图功能的代码，现在正在工作。

正方形：

TexturedSquare.prototype.draw = function() {
    gl.bindBuffer(gl.ARRAY_BUFFER,this.v);
    gl.enableVertexAttribArray(gl.va_vertex);
    gl.enableVertexAttribArray(gl.va_normal);
    gl.enableVertexAttribArray(gl.va_tex1pos);
    gl.vertexAttribPointer(gl.va_vertex,4,gl.FLOAT,false,10*4,0);
    gl.vertexAttribPointer(gl.va_normal,4,gl.FLOAT,false,10*4,4*4);
    gl.vertexAttribPointer(gl.va_tex1pos,2,gl.FLOAT,false,10*4,4*8);

    gl.activeTexture(gl.TEXTURE0);
    gl.bindTexture(gl.TEXTURE_2D,this.texture);
    gl.bindTexture(gl.TEXTURE_CUBE_MAP,null);

    gl.uniform1i(shader.textures,1);
    gl.uniform1i(shader.texture1,0);
    gl.uniform1i(shader.cube_textures,0);
    gl.uniform1i(shader.cubeTexture0,1);

    gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER,this.e);
    gl.drawElements(gl.TRIANGLES,this.l,gl.UNSIGNED_SHORT,0);

    gl.disableVertexAttribArray(gl.va_tex1pos);
}

领域：

GLHTexturedSphere.prototype.draw = function() {
    gl.bindBuffer(gl.ARRAY_BUFFER,this.vbuf);
    gl.enableVertexAttribArray(gl.va_vertex);
    gl.enableVertexAttribArray(gl.va_normal);
    gl.enableVertexAttribArray(this.va_cubetex0pos);
    gl.vertexAttribPointer(gl.va_vertex,4,gl.FLOAT,false,8*4,0);
    gl.vertexAttribPointer(gl.va_normal,4,gl.FLOAT,false,8*4,4*4);
    gl.vertexAttribPointer(this.va_cubetex0pos,4,gl.FLOAT,false,8*4,4*4);

    gl.activeTexture(gl.TEXTURE0);
    gl.bindTexture(gl.TEXTURE_2D,null);
    gl.bindTexture(gl.TEXTURE_CUBE_MAP,this.texture);

    gl.uniform1i(shader.textures,0);
    gl.uniform1i(shader.texture1,1);
    gl.uniform1i(shader.cube_textures,1);
    gl.uniform1i(shader.cubeTexture0,0);

    gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER,this.ebuf);
    gl.drawElements(gl.TRIANGLES,this.l,gl.UNSIGNED_SHORT,0);

    gl.disableVertexAttribArray(gl.va_cubetex0pos);
}

他们俩现在都在使用TEXTURE0。请检查 WebGL 状态和统一值。

原始代码对我来说有点难，对不起。texture1但我认为问题在于cubeTexture0制服被设置为相同的值。