javascript - WebGLRenderingContext.texImage2D不实现接口(interface)ArrayBufferViewOrNull

我正在处理WebGL项目，我的所有纹理都可以正常渲染。
当我想实现一个立方体贴图时，我开始遇到这种类型的错误。
在所有浏览器中为Argument 9 of WebGLRenderingContext.texImage2D does not implement interface ArrayBufferViewOrNull.。
我用来加载纹理的代码片段是

    var cubeMap = gl.createTexture();
    gl.bindTexture(gl.TEXTURE_CUBE_MAP, cubeMap);

    for(var i = 0; i < 6; i++)
    {
        var img = cubeMapArr[i];
        console.log(img);
        gl.texImage2D(
            gl.TEXTURE_CUBE_MAP_POSITIVE_X + i,
            0, gl.RGB, 1024, 1024, 0, gl.RGB, gl.UNSIGNED_BYTE,img);
    }

cubeMapArr保存HTMLImageElements。
关于这个问题有什么想法或经验吗？
像这样使用gl.texImage2D()

gl.texImage2D(gl.TEXTURE_2D,0,gl.RGBA,gl.RGBA,gl.UNSIGNED_BYTE,normalMapTexture);

没有问题的作品。
同样，normalMapTexture保存一个HTMLImageElement。

谢谢。

最佳答案

在WebGL中，texImage2D有2种形式

gl.texImage2D(bindPoint, mipLevel, internalFormat, format, type, HTMLElement);

其中HTMLElement是HTMLImageElement，HTMLVideoElement或HTMLCanvasElement

然后有

gl.texImage2D(bindPoint, mipLevel, internalFormat, width, height, border,
              format, type, ArrayBufferViewOrNull);

您的代码将HTMLImageElement传递给函数的第二种形式，这就是为什么它抱怨它不是ArrayBufferViewOrNull

换句话说，从呼叫1024, 1024, 0,中删除​​gl.texImage2D

在WebGL2中，您使用的表单存在，但请注意，WebGL2于2017年1月才在Chrome和Firefox上发布。 Edge或Safari（包括Safari iOS）尚不可用。