CODEWITHSUNDEEP
three.js
William Hilton
William Hilton

Reputation: 3133

How can I "ground" a child object in Three.js?

In Three.js, how do you keep one child object stationary while changing the rotations of the parent? I have an articulated robot model whose root node is the torso (Body_Torso), but I am trying to keep the foot (Body_RAR) "grounded". The obvious approach (computing a matrix transform for the foot, and applying it to the torso) is having really weird results that seem to be timing dependent. Here's my code:

// Hold the foot in place!
footMatrix = new THREE.Matrix4();
footMatrix.copy(hubo.links.Body_RAR.matrixWorld);

function fixFoot() {
  // Rotate the whole shebang so that the foot is the "grounded" object.
  a = new THREE.Matrix4();
  a.getInverse(hubo.links.Body_RAR.matrixWorld);
  b = new THREE.Matrix4();
  b.multiplyMatrices(a,footMatrix);
  hubo.links.Body_Torso.applyMatrix(b);
  hubo.canvas.render();
}

or something to that extent. Is Object3D.applyMatrix() asynchronous? I just get really weird results. If I just compute it once, it seems to do the right thing, but if I try and hook it up to a slider, there gets to be a lot of "jitter" in the foot location. And sometimes the robot just disappears right off the page. Is there a better way to try to achieve my goal?

Edit: Here's a live example: http://wmhilton.github.io/hubo-js/examples/sliders/sliders.html

Steps to reproduce:

  1. Check the "Beta: Keep left foot anchored." checkbox.
  2. Try changing "Left Hip Yaw". Moved slowly, it's smooth. Moved quickly, it's jerky.
  3. Uncheck "Keep foot anchored".
  4. Lift "Left Hip Pitch" so he's kicking at 90 degrees.
  5. Recheck "Keep foot anchored".
  6. Move "Left Hip Yaw". Things go crazy and the robot flies away.

Upvotes: 0

Views: 396

Answers (1)

vincent
vincent

Reputation: 1533

I could be easier to use an Object3D hierarchy, and change children .rotation attribute, instead of applying a matrix, like this robot arm simulation http://dimitriipokrovskii.appspot.com/robot_arm_joints.html

Upvotes: 1

Related Questions