My goal is to animate a rigged 3D model in three.js using pose estimation coordinates. The pose estimation technology I'm utilizing gives me real-time x, y, z coordinates from a person in a video feed, and I want to use this data to move the 3D model accordingly. I started with the code below (found some of it in an answer to a related question)...
... (Your code snippet here) ...
<script src="https://cdn.jsdelivr.net/npm/three@0.126.1/build/three.js"></script>
<script src="https://cdn.jsdelivr.net/npm/three@0.126.1/examples/js/loaders/GLTFLoader.js"></script>
<script src="https://cdn.jsdelivr.net/npm/three@0.126.1/examples/js/controls/OrbitControls.js"></script>
I also looked at this answer on calculating rotations from two vectors, but I've had difficulty implementing it successfully for my needs... How to find rotation matrix between two vectors
Getting the Vector3 data from the pose estimation technology is straightforward, and I grasp most of the logic in the code snippet. However, I struggle to integrate everything to make my 3D model mimic the movements captured by the pose estimation coordinates in the video. All I seem to achieve is making the model 'thrash around' uncontrollably.
From my understanding, to achieve the desired results, I must manipulate the rotations of the bones by computing those rotations using two vectors. Despite extensive research and experimentation, I haven't been able to bring all the pieces together successfully. Any assistance or guidance would be highly appreciated.