javascriptthree.jswebgl

GL ERROR :GL_INVALID_OPERATION : glDrawArrays: attempt to access out of range vertices in attribute 1, three.js


This has had me beat for a while now. I'm making a game, and the main map is a model using the obj format. I load it like this:

var objLoader = new THREE.OBJLoader();
objLoader.setPath('Assets/');

objLoader.load('prison.obj', function(prison){
    prison.rotation.x = Math.PI / 2;
    prison.position.z += 0.1;
    prison.scale.set(15, 15, 15)
    scene.add(prison);
});

So when I was loading the same model, but smaller, it worked normally. But, now I have added more to the model, and it is much bigger. WebGL starts giving me this warning: [.WebGL-0x7fb8de02fe00]GL ERROR :GL_INVALID_OPERATION : glDrawArrays: attempt to access out of range vertices in attribute 1. This warning happens 256 times before WebGL says WebGL: too many errors, no more errors will be reported to the console for this context.

Warnings in console

And with this warning, my model doesn't load completely. In Preview, I see the model as this, as expected:

Correct Model

But in Three.js, I see something different:

Incorrect Model in Three.js

Well, I'm not exactly sure what's wrong here:

  1. Maybe because I'm using OBJLoader CDN
  2. Maybe my model size is too large
  3. Maybe I have no idea what I'm doing

Any help is appreciated, thanks. Let me know if you need more detail.


Solution

  • Your model is likely corrupted. Try exporting the model again to make sure all the sides and vertices are accounted for.