Why won't my OBJ file load?

Questions
1

Here is a quick catch up…

Ive created a loop for an array of 3D objects to be rendered. It works, amazing, I love three.JS.

However my friend sent me a PSD file with a few cool new models. I can export these models as OBJ with the MTL file and JPG files for colours etc. This is exactly the same as the first wave of models, all OBJ with MTL and JPGs (and all working with my three.JS loop).

When the 3D objects load their progress is logged and the object 100% loads, but then nothing appears. Objects after it in the sequence load, and no errors are thrown so i’m really confused what I am doing wrong. I used a grid helper and its as if the 3D object isn’t there at all.

Also I can open a new and an old model in Photoshop and they are both looking perfect. What am I doing wrong with the new models to make them invisible? I’ve researched a lot about Photoshop 3D now so its nothing obvious like the models opacity being at 0.

Any help or advice would be amazing thanks.

Here is an image to show the 4 objects 100% loading and where the two missing new objects should be placed. Ive looked all around the 3D plane and they are not here sadly, but my two older models that use the exact same files structure render perfectly.

[Album] Imgur

Thanks in advance!

2

Can you please one of your OBJ/MTL assets? In this way, it’s easier to check whether OBJLoader has an issue with loading the file or not.

1 Like
3

yeah of course thank you so much, here is a link to my dropbox to two of the models in that demo image. One works, one does not. Thanks if i can get this working it will really impress and might even get me a new gig.

4

It seems your problematic OBJ has an extreme offset in its geometry data and hence is not visible in the view frustum. I suggest you add the following code in the onLoad() callback function to center the model at the origin:

const aabb = new THREE.Box3().setFromObject( object );
const center = aabb.getCenter( new THREE.Vector3() );

object.position.x += ( object.position.x - center.x );
object.position.y += ( object.position.y - center.y );
object.position.z += ( object.position.z - center.z );
1 Like
5

for real? wow, you are a God. I’ll check this and get back to you :bowing_man:t2:‍♂

I did look WAY out beyond the edges as this was an issue before but i didn’t know you could reset the centre point in three.JS… I was doing it manually in Photoshop with a LOT of trial and error.

Thank you for looking into this

1 Like
6

1 Like