How to rotate a CannonJS RigidBody?
cannon.js, javascript, quaternions, rotation, three.js
Solution
Solved the problem with help from the Cannon.JS developer. I'm now using:
mPlayer.objectBody.quaternion.setFromAxisAngle(new CANNON.Vec3(0,1,0), mPlayer.yawObject.rotation.y);
Problem
Does anyone know how I can rotate a CannonJS (the physics library) `CANNON.RigidBody`? I'm trying to make the object rotate with the camera, so both are facing the same direction. I know I have to modify the quaternion, but this doesn't work correctly: ``` mPlayer.objectBody.quaternion.set(0, mPlayer.yawObject.rotation.y, 0, 1); ``` It also changes the Y-position of the object, not just the rotation. Here's a demo (WASD to move the red rectangle - which is what I want to rotate) Here's the main script At the moment it automatically rotates based on the physics. Thanks for the help! EDIT: I've sort of got it working now. But it doesn't rotate fully (the whole 360 degrees) and the angle it rotates isn't quite right. If someone could take a look and see what's wrong I would really appreciate it! :) Same link as before but the rectangle/body is below the camera now, so I can see if it's rotating correctly. I added this code to make it rotate: ``` mPlayer.objectBody.quaternion.y = mPlayer.yawObject.rotation.y; mPlayer.objectBody.quaternion.w = 1; mPlayer.objectBody.quaternion.normalize(); ``` To save you looking through the code, `mPlayer.yawObject.rotation.y` is set in the MouseMove event: ``` var onMouseMove = function ( event ) { var movementX = event.movementX || event.mozMovementX || event.webkitMovementX || 0; var movementY = event.movementY || event.mozMovementY || event.webkitMovementY || 0; mPlayer.yawObject.rotation.y -= movementX * 0.002; mPlayer.pitchObject.rotation.x -= movementY * 0.002; mPlayer.pitchObject.rotation.x = Math.max( - PI_2, Math.min( PI_2, mPlayer.pitchObject.rotation.x ) ); }; ``` Thanks again!