Is there a way to use OrbitControls in three.js to make a planeMesh always remain facing the camera? I've attempted some code but it's not quite working as expected. I want the planeMesh to slowly readjust its orientation only when the camera moves, instead of spinning rapidly and using up a lot of processing power. Any idea what I'm doing wrong?
Check out this example on Plunker: here
Here's the relevant JS code snippet:
function animate() {
requestAnimationFrame( animate );
planeMesh.rotation.y -= Math.PI / camera.rotation.y;
render();
}
I also tried this alternative approach but it didn't work either:
function animate() {
requestAnimationFrame( animate );
var a = camera.rotation.y;
var b = camera.rotation.y;
if (a === b) {
planeMesh.rotation.y -= Math.PI / camera.rotation.y;
} else {
}
render();
a = camera.rotation.y;
}
** Edit
Ideally, I want the camera and planeMesh to maintain their relative positions. Here are their initial rotations:
planeMesh Rotation y = 3.141592653589793camera Rotation y = -0.06894749489830237It seems like the camera uses THREE.Euler for rotation while the planeMesh relies on Math.PI. Could these different systems of measurement be causing the issue?
If I could calculate the difference between their starting rotations and only adjust the planeMesh rotation.y if the difference exceeds a certain threshold, then I might achieve the desired outcome. How can I achieve this, and do I need to convert between these measurement systems? The camera's rotation behavior appears to use a different scale when I orbit the scene.