dart:web_gl: RENDER WARNING: texture bound to texture unit 0 is not renderable

lightandlight picture lightandlight · Feb 22, 2014 · Viewed 32.7k times · Source

I'm getting the error [.WebGLRenderingContext]RENDER WARNING: 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' when I run my web app in dartium. I've been trying to troubleshoot this issue for two days, including a full rewrite of the code, But I can't isolate the issue.

I think the problem lies in this piece of code, however.

  void main() {
  ...
    var texture = gl.createTexture();
    var image = new ImageElement();
    image.onLoad.listen((e) {
      gl.bindTexture(webGL.TEXTURE_2D, texture);
      gl.texImage2DImage(webGL.TEXTURE_2D, 0, webGL.RGBA, webGL.RGBA, 
                       webGL.UNSIGNED_BYTE, image);
      gl.texParameteri(webGL.TEXTURE_2D, webGL.TEXTURE_MAG_FILTER, webGL.NEAREST);
      gl.texParameteri(webGL.TEXTURE_2D, webGL.TEXTURE_MIN_FILTER, webGL.NEAREST);
      gl.bindTexture(webGL.TEXTURE_2D, null);
    });
    image.src = "tex.png";
  ...
  }

tex.png is 32x32

Any ideas about what the problem is?

Answer

lightandlight picture lightandlight · Feb 22, 2014

Immediately after the code in my question I had bound the texture and send the sampler uniform. This was wrong because it was executed before the image loaded. To fix this, I put the calls to bind the texture and draw elements in the onload function:

  image.onLoad.listen((e) {
    gl.bindTexture(webGL.TEXTURE_2D, texture);
    gl.texImage2DImage(webGL.TEXTURE_2D, 0, webGL.RGBA, webGL.RGBA, 
                       webGL.UNSIGNED_BYTE, image);
    gl.texParameteri(webGL.TEXTURE_2D, webGL.TEXTURE_MAG_FILTER, webGL.NEAREST);
    gl.texParameteri(webGL.TEXTURE_2D, webGL.TEXTURE_MIN_FILTER, webGL.NEAREST);
    gl.bindTexture(webGL.TEXTURE_2D, null);

    gl.activeTexture(webGL.TEXTURE0);
    gl.bindTexture(webGL.TEXTURE_2D, texture);
    gl.uniform1i(gl.getUniformLocation(shader.program, "uSampler"), 0);

    gl.drawElements(webGL.TRIANGLES, 6, webGL.UNSIGNED_SHORT, 0); 

  });

which makes sure the image has loaded.

Before, it would just assign the onload callback and then execute the next set of commands - which involved binding the texture - but because the computer is very quick it had already bound the texture and tried to draw it before the image had finished loading.