I’m a total newbie and finding my way into Three.js. So far it has been a very pleasant journey and adventure. Now I’m a bit stuck. Here is my problem.
I’m loading a gltf model with the GLTFLoader. Within the onLoad method, I’m using scene.add(gltf.scene) to add the models (three super basic cubes) to the scene. Right after that, I’m defining a simple plane that I want to use as a floor below the cubes.
When I try to add the plane to the scene with scene.add(gltf.floor) I’m getting an error message. I see two of the three meshes of the gltf rendered though.
Uncaught TypeError: Cannot read property 'type' of undefined at WebGLIndexedBufferRenderer.setIndex at WebGLRenderer.renderBufferDirect
I figured when I add the gltf meshes into a group (group.add(gltf.scene)), then I can add them to the scene together with the floor.
What crucial concept am I missing or what am I doing wrong on import and adding? Thank you for and information and wisdom.
Are you sure it’s the line scene.add(floor); throwing the error? I don’t see anything wrong with that section, but I also can’t run this code fully without the models.
You may want to try making a live demo – on JSFiddle or Codeden — and commenting out the parts with the models. Here’s a start: https://jsfiddle.net/roywzu02/1/. That seems to work, the only error I saw along the way was that onWindowResize is sometimes called before the renderer has been created, which will throw an error.
You are right, it’s not just the scene.add(floor), it’s also happening when I add a camera helper.
Ohh the model is just the default cube from blender exported directly with the gltf exporter and no export adjustments.
I will definitely strip my script and try to figure out where the problem comes from. Using jsFiddle as a second runtime env. will definitely be helpful.
