什么是 mipmapping 和 Power-of-two 错误? [英] What is the mipmapping and Power-of-Two error?

问题描述

当我在 webGL 上设置图像的非幂时遇到此错误:

I run into this error when I set a non-power of to image on webGL:

Error: WebGL warning: drawArrays: TEXTURE_2D at unit 0 is incomplete:         
Mipmapping requires power-of-two sizes.

注意，我目前正在学习 webGL.我注意到当我使用二次幂图像时，一切正常.

Note, I am currently learning webGL. I have notice that when I use a Power-of-Two image every thing works fine.

gl.bindTexture(gl.TEXTURE_2D, texture);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGB, gl.RGB, gl.UNSIGNED_BYTE, this);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);

我想做的就是学会在webgl上加载各种图片

All I want to do is learn to load all kinds of images on webgl

推荐答案

WebGL1 对非 2 次幂的纹理有限制.他们不能有 mips，也不能重复.因此，要使用非 2 次幂的纹理，您必须设置这些纹理参数

WebGL1 has limits on non-power-of-2 textures. They can't have mips and they can't repeat. So, to use a non-power-of-2 texture you have to set these texture parameters

gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);

您也可以使用 gl.NEAREST

有时你可以使用这样的代码

Sometimes you can use code like this

...
  gl.bindTexture(gl.TEXTURE_2D, texture);
  gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, image);

  // Check if the image is a power of 2 in both dimensions.
  if (isPowerOf2(image.width) && isPowerOf2(image.height)) {
     // Yes, it's a power of 2. Generate mips.
     gl.generateMipmap(gl.TEXTURE_2D);
  } else {
     // No, it's not a power of 2. Turn off mips and set wrapping to clamp to edge
     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
  }

...

function isPowerOf2(value) {
  return (value & (value - 1)) == 0;
}

请参阅这篇文章

这篇关于什么是 mipmapping 和 Power-of-two 错误?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！