Question

This seems like a simple trig question, but for whatever reason, things aren’t working out.

I’m trying to simply have an object rotate around a given point when the user presses the A/D keys (strafing around the mouse in a circular motion, while still facing the mouse).

Here’s the code I’ve tried so far (all Math functions take and return radians):

if (_inputRef.isKeyDown(GameData.KEY_LEFT))
{
    x += 2 * Math.cos(Math.atan2(mouseY - y, mouseX - x) - Math.PI * 0.5);
    y += 2 * Math.sin(Math.atan2(mouseY - y, mouseX - x) - Math.PI * 0.5);
}
else if (_inputRef.isKeyDown(GameData.KEY_RIGHT))
{
    x += 2 * Math.cos(Math.atan2(mouseY - y, mouseX - x) + Math.PI * 0.5);
    y += 2 * Math.sin(Math.atan2(mouseY - y, mouseX - x) + Math.PI * 0.5);
}

And a more elegant method which accomplishes the same thing:

if (_inputRef.isKeyDown(GameData.KEY_LEFT))
{
    x += 2 * Math.sin(Math.atan2(mouseY - y, mouseX - x));
    y -= 2 * Math.cos(Math.atan2(mouseY - y, mouseX - x));
}
else if (_inputRef.isKeyDown(GameData.KEY_RIGHT))
{
    x -= 2 * Math.sin(Math.atan2(mouseY - y, mouseX - x));
    y += 2 * Math.cos(Math.atan2(mouseY - y, mouseX - x));
}

Now, they both kind of work, the object rotates around the mouse while always facing the mouse, but given enough time of holding down the strafe button, it becomes increasingly apparent that the object is also rotating AWAY from the mouse, as if its being pushed away.

I have no idea why this is and how to fix it.

Any insight is appreciated!

Answer 1

I think your current approach would only work if you take ‘infinitely small’ steps. As it is now, each movement is perpendicular to the “to-mouse vector” and thus increases the distance between mouse and object.

A solution would be to calculate the new position while keeping the distance to the mouse unchanged, by rotating the position around the mouse:

// position relative to mouse
var position:Point = new Point(
    x - mouseX,
    y - mouseY);

var r:Number = position.length; // distance to mouse

// get rotation angle around mouse that moves
// us "SPEED" unit in world space
var a:Number = 0;
if (/* LEFT  PRESSED */) a = getRotationAngle( SPEED, r);
if (/* RIGHT PRESSED */) a = getRotationAngle(-SPEED, r);
if (a > 0) {

    // rotate position around mouse
    var rotation:Matrix = new Matrix();
    rotation.rotate(a);
    position = rotation.transformPoint(position);
    position.offset(mouseX, mouseY);

    x = position.x;
    y = position.y;
}

// elsewhere...

// speed is the distance to cover in world space, in a straight line.
// radius is the distance from the unit to the mouse, when rotating.
private static function getRotationAngle(speed:Number, radius:Number):Number {
    return 2 * Math.asin(speed / (2 * radius));
}

The above uses a Matrix to rotate the (x, y) position around the mouse position. Ofcourse you can apply the same principle without using Matrix if so desired.

I had to do some trig to come up with the right equation for getting the correct angle. The angle depends on the radius of the movement arc, since a larger radius but constant angle would increase the movement distance (undesired behavior). My earlier solution (before edits) was to scale the angle by the radius, but that would still result in slightly more movement with larger radii.

The current approach ensures that radius and speed remain constant in all cases.