webgl常见报错

案例1

texture bound to texture unit 0 is not renderable. It maybe non-power-of-2 and have incompatible tex

解决办法：有可能是你加载的图片不是2的幂次方尺寸的图片，然后你又在代码中使用了必须使用2的幂次方尺寸纹理才能做的特效，比如渐进纹理mipmap,还有可能是你的图片还没加载完成，你就开始使用了，这个时候需要等待加载完毕

案例2
webgl2：不支持 但webgl支持

var ext = gl.getExtension('OES_texture_float');
  if (!ext) {
     console.error("the extension doesn't exist on this device");
    return;  // the extension doesn't exist on this device
  }
  error:
  [.WebGL-0000018577E3E850] GL_INVALID_OPERATION: Invalid internal format.

案例3：
如果我们使用渲染纹理，要是有webgl2，不要用webgl,否则会渲染不出来

   this.gl.clearColor(1.0,0.0,0.0,1.0);
        this.gl.bindFramebuffer(this.gl.FRAMEBUFFER,this._2dScene.getFrameBuffer());
        this.gl.clear(this.gl.COLOR_BUFFER_BIT | this.gl.DEPTH_BUFFER_BIT);

案例4：
遇到下面这种报错实际上就是数组越界了，当GPU 调用glDrawArrays这个函数，根据你传入的单位数据的数目进行绘制时，发现根据单位数据的索引取不到数据了

WebGL error - glDrawArrays: attempt to access out of range vertices in attribute 0

案例5：
报错如下：

[.Offscreen-For-WebGL-07E77500]GL ERROR :GL_INVALID_OPERATION : glDrawElements: Source and destination textures of the draw are the same

出现这个问题是由于我自己在将渲染数据渲染到一张纹理的时候，又把这张纹理给渲染了一遍，解决办法就是，本次渲染不要将这张纹理参与渲染，举个通俗的例子：
假设我有好几个显示节点，每个显示节点绑定一个纹理，其中有一个显示节点的纹理（它没有数据，只是GPU那边申请了一块纹理内存），我要把它当成渲染纹理，那我再渲染的时候，如果当前渲染的目标是渲染纹理的话，那么当前这个节点就不可以参与渲染，他只能接受其它渲染数据写进它持有的纹理中，如果要显示本次渲染的结果，将目标设为屏幕，开启这个节点的渲染即可
案例6：
出现下面这个报错是因为max函数的参数不匹配，也就是没有找到相关的max重载函数，比如max(x,0),这么写就会报错，0表示的int类型，但是max的第二个参数是float类型，
在shader书写时要严格区分变量的类型

案例7：
在写webgl shader的时候，如果我们对一个vec4的变量赋值没成功，那我们在使用的它的时候，不会报错，但如果我们直接将这个变量赋给gl_FragColor会发现她其实是一个白色，其实是因为GPU给我们做了容错处理
下面有几种情况讨论：
1：如果在shader中，我们定义了一个变量，比如vec4 xx,但是却没有赋值，那这个变量参与的任何计算都是无效的，如果我们将它直接赋给gl_FragColor，会发现模型是白色，如果我们在这个变量参与的运算以后将结果再赋值给gl_FragColor，会发现模型偏黑色
2：如果在shader中我们没有对gl_FragColor进行赋值，会发现对应的模型颜色是glClearColor设置的颜色