stockhuman
commented
2 years ago Hi, looking at the article you're following, despite it being seemingly written this year, it's using v0.5.0 of use-cannon (pre-rename).
Passing geometries to cannon directly was a convenience feature that was possible when THREE still supported legacy Geometry implementations. Check out the Convex polyhedron example to see how to properly create one.
At a minimum, you should pass vertices and faces, which you can get by using legacy Geometry conversions.
This for example, does not seem to work and I think it worked in older version (though I am unsure). If I replace useConvexPolyhedron with useSphere or the others however, I have no issues but with this I get
"THREE.WebGLRenderer: Context Lost"
This worked on older versions based on this person's work.
https://aqandrew.com/blog/10-sided-die-react/
Below is the problem code
const D4 = (props) => { const radius = 1; const tetrahedronGeometry = new THREE.TetrahedronGeometry(radius); const [ref, api] = useConvexPolyhedron(() => { return { args: tetrahedronGeometry, mass: 1, ...props, }; });