I’ve been using a tool called React-Planner for a project, https://cvdlab.github.io/react-planner/, and have encountered an issue with how one of my objects is being loaded, as instead of being loaded in with faces it is instead loaded in as a wireframe.
React-Planner apparently uses the three.js obj and mtl loader as standard so I was wondering if anybody here would understand what could cause this issue as I’m unfamiliar with three.js myself.
As you can see in the image it’s only the complex door part of the model that doesn’t get loaded properly and the rest of the object is fine.
This problem apparently doesn’t stem from the mesh itself as the object appears normal in Blender and paint3D loaded the model correctly.
Any help with getting this sorted would be appreciated, I’ve attached my Blender file in case it is of use.
SBUpracticeWcleanup.blend (740.6 KB)
I load this model in threejs. Its looks normal
Would that be the same as three webGL? If so I’m stumped as to why it would work everywhere else besides this one place, thanks for your input though.
The problem is that
THREE.OBJLoader interprets your door as
THREE.LineSegments and not as
THREE.Mesh. This happens since the respective object
Cube.001_Cube.002 contains face and line definitions at the same time which is not supported by
THREE.OBJLoader. If I remove the line data from the
OBJ file, it loads fine.
There are three options now. First, you can try to adjust your modeling in Blender in order to ensure to only export meshes. Second, you can file an issue at the github repo of
three.js since other tools like Sketchfab or QuickLook file preview can parse your file correctly. Third, you might want to switch to a different format like
glTF since it is much better than
OBJ. More information about that topic right here.
Good stuff, thanks a million, I’ll look into those avenues and cheers for your help
check your obj file by viewing it in a text editor, if there is something with “l” remove that works perfect
eg: remove all “l 198 203, l 203 202” from obj