GLTF file loads but I can't see my model

Hi!
I’m trying to load a .glb file, it looks fine in the gltf viewer and I see in the console that it is 100% loaded, but all I see is a black screen. I’ve played around with the camera positioning (setting it both closer and farther away), the background color (making it lighter), and the lighting (increasing, decreasing) to no avail. Any help would be greatly appreciated. I’ve attached my code.
Thanks!!


(1) You need to call render continuously, on each frame. After line 48 you seem to be missing the next request:

const render = function () {
  renderer.render(scene, camera);

  requestAnimationFrame(() => render());
}

Since the model is loaded asynchronously, it’s quite very likely that this first (and only) render call is done before the model is in the scene.

(2) If that doesn’t work - in line 26 (after the model is loaded), try adding:

camera.lookAt(gltf.scene.position);

You can also try placing a cube in the same position as the model and see if it’s rendered at all.

thanks for the response! steps 1 and 2 didn’t work so I placed a cube and I can see it rendered correctly. I’m pretty stuck, anything else I could try?

Could you share your code on codepen or jsfiddle?

1 Like

an update - it is now throwing the error message from line 43 after logging that it is 100% loaded.

yes will do

Remove the cube, so you’ll see the model.

1 Like

it’s working now, thank you! didn’t realize the continuous render had fixed it because the cube was in the way.

1 Like