I'm a beginner when it comes to three.js and 3d programming, so forgive me if this question sounds basic. I'm hoping for an answer that can help me grasp the core concepts.
Currently, I have an object that needs to face another point (in this case, the origin) using the Object3D.lookAt(point) function, which effectively aligns the Z axis of the object towards the point.
However, I also want to rotate my object, named looker, around its Z axis so that its X axis points roughly towards a different object, refObj. I understand that achieving a direct alignment of the X axis with the refObj requires forming a right angle with the origin. My goal is to have the X axis of looker lie on the plane formed by origin, refObj, and looker.
The most apparent way to perform this rotation would be to adjust looker.rotation.z, but I lack the knowledge to calculate the appropriate value.
In essence, I am seeking an enhanced version of the lookAt function that includes a second coordinate for orienting the X axis. Something along these lines:
function lookAtAndOrient(objectToAdjust, pointToLookAt, pointToOrientXTowards)
{
// Initially look at the pointToLookAt
objectToAdjust.lookAt(pointToLookAt);
// Then proceed to rotate the object
objectToAdjust.rotation.z = ??;
}
I've put together a jsFiddle showcasing the scenario described above