Different result when using fbx models with primitive component and using gltfjsx

[AmirHo3einJS]

Hello, I use gltfjsx to create a graph of my model and everything works fine, but when I load and put the model component in the canvas, the result is this:

The little circle is the race track and it has not been scaled:

The result after scaling the group:

When I use primitive component with FBX loader:

As you can see my model hasn't been loaded correctly. I don't know what am I missing here. Could you help me load my model with gltfjsx like FBX loader?

[drcmda]

usually it's precision. the jsx plots out the numbers, position={[0.1, 0.2, etc, if the model is really small or really big one or two digits after the dot aren't enough. try --precision=6 and see if it gets better

[drcmda]

if it doesn't help could you please attach the glb, then i can fix it.

[AmirHo3einJS]

usually it's precision. the jsx plots out the numbers, position={[0.1, 0.2, etc, if the model is really small or really big one or two digits after the dot aren't enough. try --precision=6 and see if it gets better

I did it with -p 15 and it got better. but it's the material now. Some meshes use more than one material but the gltfjsx applies only one to each mesh. How can i solve this?

[AmirHo3einJS]

if it doesn't help could you please attach the glb, then i can fix it.

Here is the glb:

tunnel.zip

[drcmda]

multi material is not supported by gltfjsx, had no idea that blender can export that, or that gltf supports it. probably easy to add though. which mesh has multiple materials, do you know that?

edit, i tried to console.log out any mesh that has array materials, but it finds none.

[AmirHo3einJS]

multi material is not supported by gltfjsx, had no idea that blender can export that, or that gltf supports it. probably easy to add though. which mesh has multiple materials, do you know that?

edit, I tried to console.log out any mesh that has array materials, but it finds none.

So here is what I have found. look at this image from blender:

the banner object uses 3 materials. and now the code is like this:

and this is the shape of the banner:

so that means gltfjsx converts each object with multi-material to a group of objects. but why this object hasn't been loaded correctly and it is all black? take a look:

[AmirHo3einJS]

I think I have found what the problem is. The problem is the metallic factor of the objects. How can I reduce the metallnes factor for all of my objects? should I do it in blender or can I do it in my code? or even better, how can I add an environment map to my model? should I use blender or I could do it with code?

I'm just a developer and I don't know much about 3d models.

[drcmda]

No, that’s just how the gltf is stored, it will create multiple meshes, so there’s no problem. I would fix materials, metalness etc, in blender.

in general, you see metallic objects in blender because it has an environment map ootb. Three doesn’t so it’s black. Just slap drei/environment into the scene and you’ll see them.

closing this, there’s no bug to be fixed.

[AmirHo3einJS]

No, that’s just how the gltf is stored, it will create multiple meshes, so there’s no problem. I would fix materials, metalness etc, in blender.

in general, you see metallic objects in blender because it has an environment map ootb. Three doesn’t so it’s black. Just slap drei/environment into the scene and you’ll see them.

closing this, there’s no bug to be fixed.

thank you so much

[AmirHo3einJS]

No, that’s just how the gltf is stored, it will create multiple meshes, so there’s no problem. I would fix materials, metalness etc, in blender.

in general, you see metallic objects in blender because it has an environment map ootb. Three doesn’t so it’s black. Just slap drei/environment into the scene and you’ll see them.

closing this, there’s no bug to be fixed.

@drcmda I have a question. How can I add an environment map same as the blender that just lights up my objects? I don't want to use any hdr file, just an env map that lights up my objects. could you give me an example please?