这里是我的顶点和片段着色器:
<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 – WebGL:enablevertexattribarray索引超出范围的更多相关文章

  1. 基于HTML5 WebGL的3D机房的示例

    这篇文章主要介绍了基于HTML5 WebGL的3D机房的示例的相关资料,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  2. 为什么这个OpenGL ES 2.0着色器不能在iOS上使用我的VBO?

    如果有人能够了解这里出了什么问题,也许是对gl命令或其他一些不兼容的命令序列的错误排序,我将非常感谢你的帮助.尽管谷歌在“OpenGLES2.0编程指南”中进行了大量研究和研究,但我一直试图让这段代码整天都没有成功.我正在尝试在iPhone上的OpenGLES2.0中使用顶点缓冲区对象和自定义着色器.我试图交错来自以下类型的一系列自定义结构的顶点数据:位置,半径和颜色字节分别考虑顶点位置,点大小和

  3. ios – 如何设计一个简单的GLSL包装器,用于着色器使用

    以下简单的例子.说我有一个顶点着色器只是模拟固定的功能和两个片段着色器–一个用于绘制光滑的矩形,一个用于绘制光滑的圆.我有以下文件:基本链接现在使用这些标准的方法是什么?将上述着色器链接到两个OpenGL着色器程序?一个OO设计与着色器对象每个都有参数?

  4. ios – GL_APPLE_shader_framebuffer_fetch gl_lastFragData

    我该怎么做才能真正使用这个扩展?

  5. 用swift+Metal shader文件编译framework动态库

    若想用swift语言生成库则只能生成动态库,若是纯swift代码脚本,问题不大,按一般流程就行。若是编译的库中有shader文件则需要先编译出Metal库。把shader文件和swift文件放在一起进行framework库的编译。编译成功后会自动生成一个default.Metallib文件,该文件为shader生成的库文件。使用letlibrary=device.newDefaultLibrary()直接加载Metal库。上面的方式是最简单的,另外,对shader文件,也可以不在xcode中编译库,而是采

  6. opengl – 如何在glShaderSource中将String作为GLchar **(char **)参数传递?

    我有一个存储在String值中的着色器:函数glShaderSource具有绑定签名:当我尝试直接将着色器String传递给glShaderSource时,我收到错误消息:如何正确传递String?经过半天的搜索,我找到了没有编译错误的工作解决方案,错误的内存访问失败了:

  7. android – 如何动画渐变?

    如何设置从颜色#1到颜色#2的渐变动画?

  8. android – 自定义ImageView类不与Picasso图像下载库一起使用

    提前致谢.解决方法对于使用Picasso的圆形图像,请使用实现Transformation的this类.

  9. Android:如何排除不支持webGL的webview的设备,即在gpu_blacklist上

    我有一个包含webview的应用程序,在硬件加速不起作用的设备上运行得很差,例如一些三星S4的运行5.0.1我从这里知道:SupportingWebGLonAndroid5’sWebView我可以使用人行横道,忽略gpu黑名单,以便顺利运行.但是,这个图书馆在应用程序中导致其他问题,黑名单是否有原因?我想做的是排除webgl因为任何原因不起作用的设备.我看过这里:https://developer

  10. 打开GL 2.0 Android错误0x501(GL_INVALID_VALUE)

    我试图在Android上构建一个小的OpenGL2.0演示应用程序,但我收到以下错误在日志猫在控制台中我的代码视图解决方法您正在调用OpenGLESAPI而没有当前的上下文错误,因为您正在创建三角形Triangletri=newTriangle();在OpenGL线程之外.只有OpenGL回调中的代码才会在opengl线程上执行.在onSurfaceCreated中放置tri=newTriangle(),这些错误应该消失.

随机推荐

  1. 微信小程序canvas实现水平、垂直居中效果

    这篇文章主要介绍了小程序中canvas实现水平、垂直居中效果,本文图文实例代码相结合给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下

  2. 使用HTML5做的导航条详细步骤

    这篇文章主要介绍了用HTML5做的导航条详细步骤,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  3. H5最强接口之canvas实现动态图形功能

    这篇文章主要介绍了H5最强接口之canvas实现动态图形功能,需要的朋友可以参考下

  4. Canvas高级路径操作之拖拽对象的实现

    这篇文章主要介绍了Canvas高级路径操作之拖拽对象的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

  5. html5视频自动横过来自适应页面且点击播放功能的实现

    这篇文章主要介绍了h5视频自动横过来自适应页面且点击播放,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  6. 详解HTML5中的picture元素响应式处理图片

    这篇文章主要介绍了详解HTML5中的picture元素响应式处理图片,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  7. canvas像素点操作之视频绿幕抠图

    这篇文章主要介绍了canvas像素点操作之视频绿幕抠图的相关资料,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  8. html5利用canvas实现颜色容差抠图功能

    这篇文章主要介绍了html5利用canvas实现颜色容差抠图功能,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下

  9. canvas绘制视频封面的方法

    这篇文章主要介绍了canvas绘制视频封面的方法的相关资料,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  10. HTML5拖拽功能实现的拼图游戏

    本文通过实例代码给大家介绍了HTML5拖拽功能实现的拼图游戏,代码简单易懂,非常不错,具有一定的参考借鉴价值,需要的朋友参考下吧

返回
顶部