26
저는 javascript/canvas에서 간단한 2D 게임을 만들고 있습니다. 내 위치와 관련하여 특정 개체의 각도를 파악해야합니다.역 Y 축으로 2 포인트 사이의 각도 계산
그래서 저는 (10,10)에 있고 (10,5) 개체가 90 도가 될 것입니다 (양수 Y가 내려 가고 음수 Y가 올라감) (10,10) vs (10,15)는 270도입니다.
어떻게하면됩니까?
A
답변
37
(a, b)에 있고 객체가 (c, d)에 있다고 가정합니다. 그러면 대상의 상대 위치는 (x, y) = (c-a, d-b)입니다.
그런 다음 Math.atan2() function을 사용하여 각도를 라디안 단위로 얻을 수 있습니다.
var theta = Math.atan2(-y, x);
결과는 [-π, π] 범위에 있습니다. 당신은 음이 아닌 숫자를해야 할 경우, 다중 180/Math.PI에 의해, 라디안을
if (theta < 0)
theta += 2 * Math.PI;
을 추가하고 변환 할 수 있습니다.
6
좌표는 (xMe, yMe)이며, 그 좌표는 다음 수식 사용할 수 있습니다 (xThem, yThem) 인 경우 : 일반적으로
arctan((yMe-yThem)/(xThem-xMe))
이 arctan((yThem-yMe)/(xThem-xMe)) 것, 그러나이 경우 y 축의 부호는 반대로된다.
라디안의 결과를도 단위로 변환하려면 180/pi를 곱하십시오. Math.atan((yThem-yMe)/(xThem-xMe))*180/Math.PI
ATAN는 -pi/2 및 PI/2 사이의 값을 제공합니다 (즉, -90 ~ 90도 사이입니다) : 같은
그래서 자바 스크립트에서,이 보일 것이다. 하지만 (xThem - xMe, yMe - yThem) 벡터가있는 사분면을보고 그에 따라 조정할 수 있습니다. 쉽게 설명하자면+2
KennyTM의 대답은 사실 더 좋았습니다. Math.atan2는 당신이 이미 어느 사분원인지 알게되므로 마지막 단계에서 벗어날 수 있습니다. –
+0
나는 여전히이 답을 유용하다고 생각했다. 왜냐하면 내가 사분면을 제어하기를 원하기 때문에 좋은 대안이다. – Partack
4
는 : HTML5에서
function pointDirection(x1, y1, x2, y2) {
return Math.atan2(y2 - y1, x2 - x1) * 180/Math.PI;
}
1
는 원점 따라서 Y 축이 위에서 아래로 증가 왼쪽 상단 캔버스이다. 그래서 관계없이 중심 (C)로 A 지점의 각도를 계산하는 단위 원에 어디에 있든의 당신은 실제로해야
하고 [의 범위에 결과를 얻을 것이다 angle = Math.atan2(Cy-Ay,Ax-Cx)
같은 - π, π].
캔버스 원점을 왼쪽 하단 구석으로 만들지 않은 이유는 알 수 없습니다.
각도는 어디에서 볼 수 있습니까? –
각도를 결정하는 방법에 대해 혼란 스럽습니다 ... 전체 시간에 특정 방향으로 직면하고 있습니까? – rownage
@koage : 오해 해본 것이 아니라면 요점은 한 위치에서 다른 위치를 가리키는 벡터의 방향을 결정하는 것입니다. –