html5 – WebGL:enablevertexattribarray索引超出范围

这里是我的顶点和片段着色器:
<script id="shader-fs" type="x-shader/x-fragment">
        precision mediump float;

        uniform sampler2D uSampler;

        varying vec4 vColor;
        varying vec2 vTextureCoord;

        void main(void) {
            gl_FragColor = vColor;
            // gl_FragColor = texture2D(uSampler,vec2(vTextureCoord.s,vTextureCoord.t));
        }
    </script>
    <script id="shader-vs" type="x-shader/x-vertex">
        attribute vec3 aVertexPosition;
        attribute vec4 aVertexColor;
        attribute vec2 aTextureCoord;

        uniform mat4 uMVMatrix;
        uniform mat4 uPMatrix;

        varying vec4 vColor;
        varying vec2 vTextureCoord;

        void main(void) {
          gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition,1.0);
          vColor = aVertexColor;
          // vTextureCoord = aTextureCoord;
        }
    </script>

这是我的着色器初始化器:

function initShaders() {
  var fragmentShader = getShader(gl,"shader-fs");
  var vertexShader = getShader(gl,"shader-vs");

  shaderProgram = gl.createProgram();

  gl.attachShader(shaderProgram,vertexShader);
  gl.attachShader(shaderProgram,fragmentShader);
  gl.linkProgram(shaderProgram);

  if (!gl.getProgramParameter(shaderProgram,gl.LINK_STATUS)) {
      alert("Could not initialise shaders");
  }
  gl.useProgram(shaderProgram);

  shaderProgram.vertexPositionAttribute = gl.getAttribLocation(shaderProgram,"aVertexPosition");
  gl.enabLevertexAttribArray(shaderProgram.vertexPositionAttribute);

  shaderProgram.vertexColorAttribute = gl.getAttribLocation(shaderProgram,"aVertexColor");
  gl.enabLevertexAttribArray(shaderProgram.vertexColorAttribute);

  shaderProgram.textureCoordAttribute = gl.getAttribLocation(shaderProgram,"aTextureCoord");
  gl.enabLevertexAttribArray(shaderProgram.textureCoordAttribute);

  shaderProgram.pMatrixUniform = gl.getUniformlocation(shaderProgram,"uPMatrix");
  shaderProgram.mvMatrixUniform = gl.getUniformlocation(shaderProgram,"uMVMatrix");
  shaderProgram.samplerUniform = gl.getUniformlocation(shaderProgram,"uSampler");
}

错误来自这一行:

gl.enabLevertexAttribArray(shaderProgram.textureCoordAttribute);
  >> enabLevertexattribarray index out of range

我该如何处理?

解决方法

这只是因为你没有在你的顶点程序中使用aTextureCoord,所以GLSL-Compiler通过删除它来优化它.你真的应该检查gl.GetAttribLocation()的结果是否有错误,并且只启用程序中存在的属性.在缺少属性的情况下发出警告就足够了,我知道无法通过编译器区分着色器创作错误和优化.

相关文章

HTML5和CSS3实现3D展示商品信息的代码
利用HTML5中的Canvas绘制笑脸的代码
Html5剪切板功能的实现
如何通过HTML5触摸事件实现移动端简易进度条
Html5移动端获奖无缝滚动动画实现
关于HTML5和CSS3实现机器猫的代码