Hello everyone, new to THREE.js here! I am using it for a mini project and would appreciate some insight. The idea is to have multiple jiggly boxes animate in different ways (and would later be used as a tool for physics animation rendering, so the behavior of each animation needs to precisely be controlled using a physics inspired models). I tried a lot of approaches to make meshes that I define by code be rendered as skinned meshes but couldn’t, even tried single mesh and couldn’t get it to work, only models imported externally and that were properly rigged and binded worked basically.
Are there any resources on defining skinned meshes procedurally? Has any of you tried it before?
In one of my courses I have a dozen of slides about procedural skinning.
Here are two simple examples from the course:
E1207-SkinnedMesh-1
E1208-SkinnedMesh-2
And one more complex:
Notes: vax.js just creates renderer, camera, light, scene (nothing interesting there)
If you want I can also add the slides about skinning that describe the three examples, but they are not in English (Google translate should be able to translate the texts).
Here is one short video that I made in the past. It uses Bézier spaces (something like 3D spline), not skinning. The point is, depending on the type of deformations you want, skinning may not be the only possible approach.
https://www.youtube.com/watch?v=DOZZT9iyans
A few other demos:
Bezier space
Procedural skinning
Procedural skinning with bump map
When I started with three.js, I did some tests. Also for skinned mesh.
(Partly German, easily translatable.)
Skelett und Knochen
Skelett und Knochen
Skelett und Knochen
skeleton
then later 2022
.frustumCulled = false until you get it working.