Вращение изображения в точку мыши с использованием ATAN вместо ATAN2

Question

Чтобы лучше понять, как работает тригонометрия в разработке игр, я создавал небольшие фрагменты javascript для CodePen.

Мне удалось создать пример, который использует Math.atan2(), чтобы нарисовать пистолет-пистолет с курсором мыши.

Теперь я пытаюсь выполнить ту же самую вещь, используя функцию Math.atan(), но она не работает должным образом.

Вот логика код, я использую:

canvas.onmousemove = function(event) { 
    Mouse = { 
    x: event.pageX, 
    y: event.pageY 
    } 

    // These length variables use the distance formula 
    var opposite_length = Math.sqrt((Mouse.x - Mouse.x) * (Mouse.x - Mouse.x) + (Mouse.y - y) * (Mouse.y - y)); 

    var adj_length = Math.sqrt((Mouse.x - x) * (Mouse.x - x) + (y - y) * (y - y)); 


    var angle_in_radians = Math.atan(opposite_length/adj_length); 

    //var angle_in_radians = Math.atan2(Mouse.y - y, Mouse.x - x); 

    angle = angle_in_radians * (180/Math.PI); 
} 

ИН моей ничьи функции(), я повернуть пистолет в угол вар с помощью:

cxt.rotate(angle*(Math.PI/180));

Если вы раскомментировать линия, начинающаяся с // var angle_in_radians, все будет работать.

Итак, atan2 работает, но atan производит результат, который я хочу.

Я знаю, что opposite_lengt h и adj_length являются точными, потому что когда i console.log() они являются правильными значениями.

Вы можете проверить используемый код on CodePen для примера.

Там много инициализации вещи, но вы только действительно необходимо сосредоточить внимание на секции canvas.onmousemove = function(event), начиная от линии 50. Вы также можете проверить свою функцию отрисовки на линии 68.

Answer 1

Обратите внимание, что ваш расчет Атан эквивалентно до

atan2(abs(mouse.y-y), abs(mouse.x-x)) 

Координаты экрана имеют противоположную ориентацию по декартовым координатам. Чтобы получить декартово угол от координаты экрана, используйте

atan2(y-mouse.y, mouse.x-x)