Three.js and cannon.js are different in width property of object

Questions
1

Hello everybody, hope you are doing well. I need help of pro webgl dev.

I created box in three.js and for collision effect I added box in cannon.js too.
But width property of three.js and cannon.js are different.
Actually, it was double in cannon.js.

I’m attaching the code:
-three
const playerGeo = new THREE.BoxGeometry(1, 1, 1);
//const playerGeo = new THREE.BoxGeometry(2, 2, 2); Setting it up like this works fine.
-cannon
const boxBody = new CANNON.Body({
mass: 5,
position: new CANNON.Vec3(0, 3, 0),
shape: new CANNON.Box(new CANNON.Vec3(1, 1, 1)),
});

Thanks.

2

CANNON.Box takes “half extents” as its arguments, instead of width/height/depth. To get it to match three.js, you’ll need to divide each parameter by two.

3

Thank you for your kind explanation.
If so, does it work that way on spheres and planes as well?

4

I think you’ll have to check the API docs for each class you’re using, to learn what it expects. three.js and cannon.js were written independently.