Now, we should start animating and rendering things. In a perfect world we could perform our own window.requestAnimationFrame()
calls, fetching the latest Leap data frames with controller.frame() and repainting the Three.js scene, but at present such a setup is impossible to test due to the incomplete state of the LeapJS library.
Our demonstration integration with Three.js and LeapJS will be simplicity itself; we'll rotate our cute lil' unit cube according to the user's hand rotation. When new hand tracking updates come in from the controller, we'll rotate the cube according to the palm normal of the first returned hand.
A normal is like a ray projecting outward from a surface, representing its orientation. The palmNormal property of a Leap.Hand is expressed as a unit vector that points outward from the plane described by the palm of the hand. The use of a palm normal for rotating an object works nicely because we can describe the rotation of the cube based on the normal...
