绘制元素使用 [英] drawElements use

问题描述

我在 WebGL 中创建了一个小应用程序，我有两个移动的对象，一个立方体和一个球体.我用着色器修改对象，每个对象都有它的着色器.所以我想在确定的时间更新显示器上的对象，为此我使用 drawElements 函数.

I create a little application in WebGL, I have two objects which move, a cube and a sphere. I modify objects with shaders, each object have it shader. So I want update objects on the display at determine time, for this I use drawElements function.

对于每个对象，我都有一个缓冲区，其中包含顶点缓冲区中的面索引:

For each object I have a buffer which contains indices of faces in vertices buffer :

gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(indices), gl.STREAM_DRAW);
indexCount = indices.length;

indices 是一个数组，其中包含每个面的索引值.(每个面 3 个值，我们使用三角形).

indices is an array which contains values of indices of each faces. (3 values per face, we work with triangles).

因此，在此之后，为了绘制对象的三角形，我会这样做:

So, after this, for draw triangles of the object I do :

gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, indexBuffer);
gl.drawElements(gl.TRIANGLES, indexCount, gl.UNSIGNED_SHORT, 0);

但是我屏幕上什么都没有，而且我有这个警告:

But I have nothing on the screen, and I have this warning :

WebGL:INVALID_OPERATION:drawElements:属性设置不正确

WebGL: INVALID_OPERATION: drawElements: attribs not setup correctly

我的错误可能是什么?

谢谢

推荐答案

我想你错过了在 drawElements() 之前将 javascript 顶点缓冲区链接到着色器属性的代码.

I think you missed codes which link javascript vertex buffer to shader's attributes before drawElements().

例如:

gl.bindBuffer(gl.ARRAY_BUFFER, meshVertexPositionBuffer); 
gl.vertexAttribPointer(shaderProgram.vertexPositionAttribute, 
                     meshVertexPositionBuffer.itemSize, gl.FLOAT, false, 0, 0); 
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, meshIndexBuffer);
gl.drawElements(gl.TRIANGLES, meshIndexBuffer.numberOfItems, gl.UNSIGNED_SHORT, 0);

这篇关于绘制元素使用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！