How can I make colliders from glb objects with cannon js?

I’m doing a virtual tour and I have some animations and stands in which my main character needs to detect those objects (glb or gltf) with animations or stands to not get through them.

I’ve looked some examples but all of them were for physics (objects falling through to the floor).
I would like if some of you can recommend me a link in which I a can base on

There are two common ways of dealing with character navigation constraints: physics, or a navigation mesh. Physics is probably easier if you need parts of the game world to move around or be animated, like a platformer. In that case you could use something like three-to-cannon or three-to-ammojs to generate a physics collider from your THREE.Mesh.

If you don’t need the environment to move around, using a navmesh can be easier to get working… see three-pathfinding, it’s made for AI pathfinding but I’ve used the clampStep(...) method for constraining player movement as well.

Note that these are both nontrivial to set up. Unfortunately I don’t have a simple example to share.

1 Like

When using Cannon it is important to understand that TriMesh to TriMesh collisions are not supported. Only Sphere to TriMesh is supported. So if you’re using a modelled collider, only Cannon created Sphere can be used for the collisions.

1 Like

the easiest is probably convexpolyhedron. here’s an example where it takes a glb and creates a world object with colision: it does fall on the floor but it’s the same principle, you set up objects as dynamic (default, affected by everything), static (infinite mass, but affected by other objects) or kinematic (user controlled).

this is using cannon-es, the original cannon is not maintained for years and i think convexpoly especially had bugs.