使用webGL绘制元素

Question

我有面部索引(指向点)和点,并希望在循环中绘制三角形.Web控制台给我这个错误:

WebGL: drawElements: bound element array buffer is too small for given count and offset

这是我的代码:

for(var i=1;i<38000;i++){
 var vtx = new Float32Array(
 [points[faces[i][1]][1],points[faces[i][1]][2],points[faces[i][1]][3],
  points[faces[i][2]][1],points[faces[i][2]][2],points[faces[i][2]][3],
  points[faces[i][3]][1],points[faces[i][3]][2],points[faces[i][3]][3]
]
);
var idx = new Uint16Array([0, 1]);
initBuffers(vtx, idx);
gl.lineWidth(1.0);
gl.uniform4f(shaderProgram.colorUniform, 0, 0, 0, 1);
gl.drawElements(gl.LINES, 3, gl.UNSIGNED_SHORT, 0);
unbindBuffers();
}
}

例程没有任何东西.我该如何解决这个问题？

Answer 1

您的drawElements呼叫需要第二个arg(计数)的不同值.

首先:它表示您正在绘制的顶点数(不是基元!).所以(gl.TRIANGLES, 3...)会绘制一个三角形.(gl.LINES, 2...)会划出一条线,(gl.LINES, 4...)画2条,但(gl.LINES, 3...)画出什么,一条线和一条线？确保您的计数与基本类型匹配.

其次,假设您正确地上传到idx缓冲区并绑定它,您只提供了两个索引,而您的绘制调用表明您正在绘制三个.这可能是导致错误的原因.将计数更改为2您的代码应该工作(假设您已正确设置其他所有内容).至少你会避免收到的错误信息.