Default rotation for GLTF model

I have a GLTF model of an arrow that is rotated to face down the negative z-axis. When I load it in a gltf editor this rotation is respected. However, when I load the model in Three, the arrow is pointing up along the y-axis and is not rotated as it should be. Does three respect the default rotation of gltf models? I would stick to simply rotating the models after loading them, but unfortunately that option will require lots of math that I’d like to avoid if possible.

I’m attaching the glb which you can open in https://www.gltfeditor.com/ to see how it should look. (Note: in this editor the arrow points down the X axis as the axes are labeled differently than in three)

arrow.glb (25.8 KB)

three.js does not change the default orientation of a glTF model. It looks correct in three.js / editor as well. Are you putting the entire gltf.scene result into your scene, or just extracting the geometry? If you’re extracting the geometry you would need to apply mesh.rotation to the geometry vertices first.

Ahh that sounds like the culprit. I’m extracting the geometry not using the whole scene. @donmccurdy Any chance you could provide an example of how to apply mesh.rotation to the geometry vertices? This is an instanced mesh with many instances of the rotation which I’m afraid may make this more complicated. I need the arrows to be pointing down the z-axis by default because so far calculating the rotations they would need otherwise has proven to be beyond my mathematical skills haha

I think it’d be something like…

mesh.updateWorldMatrix(true, true);
const geometry = mesh.geometry;
geometry.applyMatrix4(mesh.matrixWorld);

… this overwrites the vertices in the mesh, so you wouldn’t want to do it repeatedly, but after doing this once the orientation should be what you need in the InstancedMesh.

Thank you so much. I think this is very close. Still something thats alluding me though. The result of your snippet is this:

The original is this:

It looks like the rotation of the arrows actually has changed. I accomplished that by rotating the mesh before your snippet mesh.rotation.set(0,0,Math.PI/2). Is there any way I can avoid rotating the entire mesh but still get the arrows default rotation to change as it has in the first screenshot? Sorry if this has left the topic, I can start a new thread if need be

Nevermind! All I needed to do was set the rotation of the mesh back to (0,0,0). As long as I don’t geometry.applyMatrix4(mesh.matrixWorld); again after that the arrows remain rotated. Thank you so much for your help!

1 Like