javascript - 尝试在 Three.js 中使用 mipmaping 时出现错误

Question

我正在尝试在 two.js 纹理中使用 mipmap 生成。

创建纹理时，我将大小为 512x512 的图像分配给 mipmaps[0]。
因此，如果我的理解是正确的，WebGL 应该使用该图像来生成更小的 mipmap 纹理。但随后我看到呈现的黑色纹理和如下错误:

在 Chrome 中

WebGL: drawElements: texture bound to texture unit 0 is not renderable. It maybe non-power-of-2 and have incompatible texture filtering or is not 'texture complete'. Or the texture is Float or Half Float type with linear filtering while OES_float_linear or OES_half_float_linear extension is not enabled.

在火狐浏览器

Error: WebGL: A texture is going to be rendered as if it were black, as per the OpenGL ES 2.0.24 spec section 3.8.2, because it is a 2D texture, with a minification filter requiring a mipmap, and is not mipmap complete (as defined in section 3.7.10).

创建纹理的代码如下所示:

var texture = THREE.ImageUtils.loadTexture( 'images/512.png', undefined, function() {
    texture.repeat.set( 1, 1 );
    texture.mipmaps[ 0 ] = texture.image;
    texture.generateMipmaps = true;
    texture.needsUpdate = true;
};

使用 Canvas 而不是图像也会出现同样的问题。

To clarify:

• image is power-of-2
• image already loaded

有人可以告诉我在哪里挖掘这个问题吗？

Answer 1

问题已解决。我已经明白我的错误了。渲染后，我对空纹理的 mipmaps 数组感到困惑，并确定 mipmaping 不起作用。事实上它应该是空的，因为 webgl 不会返回生成的图像堆栈。