react-three/cannon : offset around the GLTF model, model dosent touch the floor

Question

i'm trying react-three/cannon and my goal is to drop a "Cube" and a "GLTF model" from a position and let them land on a "Floor". it works well for the Cube (he touches the "Floor") but the "GLTF model" drops but never touch the "Floor"...

I think that there's an offset in the model or maybe some scale natively but i cant figure it out. enter image description here I have some code and a video to illustrate. Thank you all for your help guys !!! enter image description here

enter image description here

Answer 1

I think is because something like the image,

the bound box of the collider is bigger than your model.

to fix it, just set the property to size/2:

const [ref, api] = useBox(
  () => ({
    args: [0.1, 0.1, 0.1], // extents: [x, y, z]
}));

I'm was also struggling with the same issue, and I checked the code of Pingpong demo, saw it's using args props in the useBox hook.

The Readme didn't give much description about it, but I found this comment in the code

Answer 2

Have you checked where the origin of the GLTF-model is? I often find models on the web where it is not in the center of mass of the geometry. If you work with Blender right click the model and choose 'set origin' and then 'center of mass volume'. You can also check where the physics box of the GLFT is by making it visible. Add another tag in the physics tag named <Debug color='black'></Debug> and add your JSXs inside the debug tag.