16
tôi đang chơi xung quanh với WebGL cố gắng để tìm hiểu nó, vì vậy tôi mất một số mã từ một hướng dẫn webgl, và cố gắng thêm đường của riêng tôi, nhưng bất cứ khi nào tôi chạy nó, nó mang lại cho tôi lỗi này:WebGL drawElements nằm ngoài phạm vi?
.WebGLRenderingContext: GL ERROR :GL_INVALID_OPERATION : glDrawElements: attempt to access out of range vertices in attribute 0
Lưu ý: attribute 0 là đệm đỉnh của tôi
đang đệm khởi của tôi là (rõ ràng là giả vars toàn cầu nếu không có định nghĩa)
cubeVertexPositionBuffer = gl.createBuffer(); // create a buffer
gl.bindBuffer(gl.ARRAY_BUFFER, cubeVertexPositionBuffer);
//for laziness
var _f=1.0/3.0;
vertices = [ // this is code from the tutorial
// Front face
-1.0, -1.0, 1.0, 1.0, -1.0, 1.0, 1.0, 1.0, 1.0, -1.0, 1.0, 1.0,
// Back face
-1.0, -1.0, -1.0, -1.0, 1.0, -1.0, 1.0, 1.0, -1.0, 1.0, -1.0, -1.0,
// Top face
-1.0, 1.0, -1.0, -1.0, 1.0, 1.0, 1.0, 1.0, 1.0, 1.0, 1.0, -1.0,
// Bottom face
-1.0, -1.0, -1.0, 1.0, -1.0, -1.0, 1.0, -1.0, 1.0, -1.0, -1.0, 1.0,
// Right face
1.0, -1.0, -1.0, 1.0, 1.0, -1.0, 1.0, 1.0, 1.0, 1.0, -1.0, 1.0,
// Left face
-1.0, -1.0, -1.0, -1.0, -1.0, 1.0, -1.0, 1.0, 1.0, -1.0, 1.0, -1.0,
// this is my own code
-1.0+ _f, -1.0, 1.0, -1.0+ _f, -1.0, -1.0,
-1.0+2*_f, -1.0, 1.0, -1.0+2*_f, -1.0, -1.0,
-1.0+3*_f, -1.0, 1.0, -1.0+3*_f, -1.0, -1.0,
-1.0+4*_f, -1.0, 1.0, -1.0+4*_f, -1.0, -1.0,
-1.0+5*_f, -1.0, 1.0, -1.0+5*_f, -1.0, -1.0
];
gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices),
gl.STATIC_DRAW);
cubeVertexPositionBuffer.itemSize = 3;
cubeVertexPositionBuffer.numItems = 34;
// color buffer code is irrelevant because my color buffer is attribute 1 not 0
// plus it's all copied from the tutorial
// index buffer
// note I changed some code so the cube drawn is wireframe instead of solid
// I tested that without extra vertex or index buffer data and it worked
cubeVertexIndexBuffer = gl.createBuffer(); // this modified a bit from the tutorial
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, cubeVertexIndexBuffer);
cubeVertexIndices =
[ 0, 1, 2, 3, 0, // Front face
4, 5, 6, 7, 4, // Back face
8, 9, 10, 11, 8, // Top face
12, 13, 14, 15, 12, // Bottom face
16, 17, 18, 19, 16, // Right face
20, 21, 22, 23, 20, // Left face
// this is my code
24, 25, 26, 27, 28, 29, 30, 31, 32, 33
];
gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(
cubeVertexIndices), gl.STATIC_DRAW);
cubeVertexIndexBuffer.itemSize = 1;
cubeVertexIndexBuffer.numItems = 40;
Và đây là mã vẽ của tôi
// set up perspective and stuff
gl.bindBuffer(gl.ARRAY_BUFFER, cubeVertexPositionBuffer);
gl.vertexAttribPointer(shaderProgram.vertexPositionAttribute,
cubeVertexPositionBuffer.itemSize, gl.FLOAT, false, 0, 0);
gl.bindBuffer(gl.ARRAY_BUFFER, cubeVertexColorBuffer);
gl.vertexAttribPointer(shaderProgram.vertexColorAttribute,
cubeVertexColorBuffer.itemSize, gl.FLOAT, false, 0, 0);
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, cubeVertexIndexBuffer);
gl.uniformMatrix4fv(shaderProgram.pMatrixUniform, false, pMatrix); // perspective matrix
gl.uniformMatrix4fv(shaderProgram.mvMatrixUniform, false, mvMatrix); // model view matrix
gl.lineWidth(1.0);
gl.drawElements(gl.LINES, cubeVertexIndexBuffer.numItems,
gl.UNSIGNED_SHORT, 0);