In my three.js scene I can add and edit objects. I recently added a "Rotate Camera" checkbox which works great. But the problem is that the transformControls attached to the object seems to rotate differently: when I stop the rotation, the controls are displaced in comparison with the object. Here is my function:
function optionCameraRotation() {
"use strict";
return {
ROTATION_Y_AXIS : false
};
}
var rotationOption = optionCameraRotation();
My GUI.DAT button:
guiCamera.add(rotationOption, 'ROTATION_Y_AXIS').name('Rotation Active');
And my animate() function:
function animate() {
requestAnimationFrame( animate );
THREE.AnimationHandler.update( 0.05 );
if (rotationOption.ROTATION_Y_AXIS) {
scene.rotation.y = (scene.rotation.y + 0.005 * 4) % (Math.PI * 2);
}
renderer.render( scene, camera );
update();
}
Where is the problem located ?
I just had to correct my if statement in my animate() function like this:
if (rotationOption.ROTATION_Y_AXIS) {
var timer = Date.now() * 0.0001;
camera.position.x = Math.cos( timer ) * 200;
camera.position.z = Math.sin( timer ) * 200;
camera.lookAt( scene.position );
renderer.render( scene, camera );
}