opengl-es - mipmap 纹理显示错误

Question

我已经使用 webgl 做了很多工作，但现在它是第一次使用 dart，我遇到了一个奇怪的错误。我创建一个像这样的默认纹理:

  GlTexture() {
    mTexture = gl.createTexture();
    updateMemory(1, 1, new Uint8List.fromList([0x00, 0x00, 0xFF, 0xFF]));
  }

updateMemory 使:

  void updateMemory(int width, int height, Uint8List colors, [ bool genMipMaps = true ]) {
    gl.bindTexture(TEXTURE_2D, mTexture);
    gl.texImage2DTyped(TEXTURE_2D, 0, RGBA, width, height, 0, RGBA, UNSIGNED_BYTE, colors);
    if(genMipMaps) {
      gl.generateMipmap(TEXTURE_2D);
    }

    gl.bindTexture(TEXTURE_2D, null);
  }

该纹理完美呈现为蓝色方 block 。但是，如果我将 updateMemory 调用更改为除 1x1 纹理之外的任何内容，则结果完全错误，让我举个例子:

  GlTexture() {
    mTexture = gl.createTexture();
    updateMemory(2, 2, new Uint8List.fromList([0x00, 0xFF, 0x00, 0xFF, 0x00, 0x00, 0xFF, 0xFF, 0xFF, 0x00, 0x00, 0xFF, 0x3F, 0x7F, 0xFF, 0xFF]), true);
    gl.bindTexture(TEXTURE_2D, mTexture);
    gl.texParameteri(TEXTURE_2D, TEXTURE_MIN_FILTER, LINEAR_MIPMAP_NEAREST);
    gl.bindTexture(TEXTURE_2D, null);
  }

结果如下所示:



虽然 2x2 结构是可见的，但其余的都是完全错误的。如果需要，我还可以提供着色器。

/编辑:
当我将纹理设置为图像的内容时，渲染看起来如下:



纹理本身渲染正确，但 mip 级别有点错误。

Answer 1

假设代码正在执行 generateMipMap在代码中流动，以便生成 mipmap。 TEXTURE_MAG_FILTER 设置怎么样？此外，与 GL 视口(viewport)大小相关的 CSS 缩放与 CSS 最终尝试缩放到显示的内容之间可能存在问题。

编辑:具体来说，您是否将 Canvas 宽度/高度设置为与最终显示宽度/高度匹配？