Mysterious .OBJ file doesn’t appear in my scene (But others do)


I’m struggling to visualize an .OBJ file in my scene, I have .obj files comin’ from different sources, and one of them refused to show !

Let’s call them OK.obj & NOTOK.obj
I have a scene with :
objLoader, PerpectiveCamera & AmbiantLight

To setup the context : I tried/discover using three.js/editor, because on threeJS editor both are loading

  • NOTOK.obj have a scale different of OK.obj (so I defined object.scale.set(1000,1000,1000))

And then I’m trying to recreate the same configuration of camera than the three.js/editor but I do not succeed to view NOTOK.obj,

Do you have an idea of what I’m doing wrong ? what else can I try/check ?
NOTOK.obj (238.8 KB)
OK.obj (301.9 KB)

Using .obj format :full_moon_with_face:

Both files seem to load nicely in Blender, so it’s something most likely with the code (the scale is ~1000x different between the objects, but if you rescale the smaller one, it should show fine.)

Yess thanks,

Like I said I already try it to rescale x1000 but still it doesn’t appears,

It’s working in three.js/editor but not in my scene …

Hard to help without seeing the code though (at least the part used for loading the models) :sweat_smile:

The camera :

export function createCamera(sizes) {
    const camera = new PerspectiveCamera(
        sizes.width / sizes.height,
    camera.position.x = 0
    camera.position.y = 0
    camera.position.z = 320

    return camera

The light :

const light = new AmbientLight(0x404040);

The control :

export function createArcballControls(camera, canvas, scene) {

    const controls = new ArcballControls(camera, canvas, scene)
    controls.enableRotate = true
    controls.enableZoom = true
    controls.enablePan = true
    controls.enableAnimations = false // correspond to disable damping


    controls.setMouseAction('PAN', 0) // left
    // controls.setMouseAction('ZOOM',1) // middle 
    controls.setMouseAction('ROTATE', 2) // right

    controls.zoomSpeed = 2
    controls.panSpeed = 1
    controls.rotateSpeed = 1
    // controls.maxZoom = 120
    // controls.maxZoom = 120
    // controls.tick = () => controls.update();

    // controls.update()

    return controls

And the part to load the Obj :

   let object = await OBJloader.loadAsync(objUrl)
        //Go through all children of the loaded object and search for a Mesh
        object.traverse( function ( child ) {
            //This allow us to check if the children is an instance of the Mesh constructor
            if(child.isMesh ){
                f_moveFootPrint(child, standardMaterial)
                // if the points are already set we update the map
       = "footPrint"
        importMesh = object

       // add box  helper to the scene
         var helper = new THREE.BoxHelper( importMesh, 0xffff00 );
         scene.add( helper );



That just one obj though - please show or replicate the complete code of how you load both obj’s after which one of them fails to show.

I’m using the same code to load them, just changing the URL to select the file

In that case - the code above does load both models, but one of them is 1000x smaller, and the code above does not scale it up to a proper scale :sweat_smile:

Also - if both models are loaded with that snippet, they are likely overlapping one-another - and since they are both rendered using MeshBasicMaterial, they will have no shading applied, so it may be impossible to tell one model from another in the scene.

1 Like

Okay I succeed to get the part of code which is problematic …

I have a code to Smooth the geometry which is the following :

export function setSmoothGeometry(geometry,tolerance=1 ) {
    const merged = mergeVertices(geometry,tolerance ); // this is a mystery
    // tempGeometry.mergeVertices();
    return merged

from this old topic : [SOLVED] How can we smooth model loaded with OBJLoader (i.e. not flat shading)? - #7 by Mugen87

I do not totally get what’s the tolerance for … But with the NOTOKAY file if I let the tolerance to 1 the geometry disappears