Problem with Clock in Chapter 6


#1

When I add the Clock object to the program on page 70 of the second edition, I get an error message that I can’t figure out:

    var clock = new THREE.Clock();
    var isCartwheeling = false;
    var isFlipping = false;
    function walk() {
      var speed = 10;
      var size = 100;
      var time = clock.getElapsedTime();
      var position = Math.sin(speed * time) * size;
      rightHand.position.z = position;
    }
    function acrobatics() {
      if (isCartwheeling) {
        avatar.rotation.z = avatar.rotation.z + 0.05;
      }
      if (isFlipping) {
        avatar.rotation.x = avatar.rotation.x + 0.05;
      }
    }
    function animate() {
      requestAnimationFrame(animate);
      walk();
      acrobatics();
      renderer.render(scene, camera);
    }

Here’s the error:

code.html:92 Uncaught TypeError: Cannot read property 'getElapsedTime' of undefined
    at walk (code.html:92)
    at animate (code.html:109)

Thanks for your help!


#2

This code it 100% correct. See the answer in this topic for an explanation of what was happening. It’s a good thing you shared your entire project there – this was super hard to figure out and I wouldn’t have been able to help without all the code! :slight_smile:

-Chris