尝试在Three.js中使用Mipmaping时出错 [英] An error when try to use mipmaping in three.js

问题描述

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

I'm trying to use mipmaps generation in three.js textures.

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

Chrome浏览器

When creating a texture I assign an image of size 512x512 to mipmaps[0].
Thus if my understanding is correct this image should be used by WebGL to generate smaller mipmaps textures. But then I see a black texture rendered and errors like this:

in chrome

WebGL:drawElements:绑定到纹理单元0的纹理不是 可渲染的.它可能不是2的幂，并且具有不兼容的纹理 过滤或纹理不完整".或者纹理是Float或 带有线性过滤的Half Float类型，而OES_float_linear或 未启用OES_half_float_linear扩展.

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.

在Firefox中

错误:WebGL:纹理将被渲染为黑色， 根据OpenGL ES 2.0.24规范第3.8.2节，因为它是2D 纹理，带有需要mipmap的缩小滤镜，而不是 mipmap完成(如第3.7.10节中所定义).

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).

用于创建纹理的代码如下:

The code for creating a texture looks like:

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;
};

使用画布而不是图像的相同问题.

The same problem using a canvas instead of an image.

要澄清:

• 图像是2的幂
• 图像已加载

有人可以给我一个后面去探讨这个问题的地方吗?

Can someone give me a hind where to dig this problem to?

推荐答案

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

Problem solved. I have understood my mistake. I was confused by an empty texture's mipmaps array after rendering and decided that mipmaping does not working. In fact it should be empty as webgl does not return generated stack of images.

这篇关于尝试在Three.js中使用Mipmaping时出错的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！