JavaScript 는 atan 2 를 사용 하여 화살표 와 곡선 을 그 리 는 인 스 턴 스 를 사용 합 니 다.

최근 에 Canvas 그림 을 그 려 서 JavaScript 에서 atan 2(y,x)라 는 삼각 함 수 를 제공 한 다 는 것 을 알 게 되 었 습 니 다.얼핏 보면 모 르 겠 어 요.고등학교 때 배 운 삼각함수 에는 sin,cos,arcsin,arccos,tan,arctan 등 이 있 는데 이것 이 없어 요.업무 중 에 그것 을 사용 해 야 하기 때문에 여기 서 간단 한 이 해 를 했다.
좌표계 에서 tan 과 atan 을 이해 하 다.
삼각함수 tan 돌 이 켜 보기:
tanθ，삼각함수 로 표시 할 때,그것 의 값 은 sin 과 같다.θ/cosθ，좌표계 에 넣 으 면 그 값 은 D/dx 와 같 습 니 다.좌표계 에서 임의의 두 점 으로 구 성 된 직선 은 x 축의 경사 율 에 비해 tan 이다.θ = dy/dx,y 축의 경사 율 에 비해 dx/dy 입 니 다.이때 우 리 는 cot 로 표시 합 니 다.그 중에서 dy 는 두 점 의 y 좌표 의 차이 이 고 dx 는 두 점 의 x 좌표 의 차이 이다.
그러면 좌표계 안에 Y 축 을 제외 하고 그 어떠한 점(x,y)도 x 축 에 비해 경사 율 은 y-0/x-0,즉 y/x 이다.

우리θx 축의 경사 율 에 비해 직선 이 라 고 합 니 다.그러면...θ바로 x 축의 협각(회전 각도)에 대한 것 이다.
tan,각도 에 따라 경사 율 을 계산 합 니 다.그럼 반대로 arctan 은 당연히 경사 율 에 따라 각 도 를 계산한다 고 생각 합 니 다.
왜 atan 2 가 존재 합 니까?
자 바스 크 립 트 에서 두 개의 arctan 함 수 를 제 공 했 습 니 다.하 나 는 atan 이 고 하 나 는 atan 2 입 니 다.atan 은 우리 가 잘 아 는 arctan 이다.사실 많은 프로 그래 밍 언어 에서 atan 2 를 제공 합 니 다.
그럼 atan 2 는 어떻게 된 거 죠?
이것 을 알 기 위해 서 는 arctan 의 부족 한 점 을 알 아야 합 니 다.
arctan 의 반환 값 범 위 는(-pi/2,pi/2)포함 되 지 않 으 며±pi/2,즉(두 점 으로 구 성 된 직선 과 x 축 협각 은 90°)90°는 계산 할 수 없다.왜?arctan(dy/dx)을 계산 할 때 두 점(x1,y1),(x2,y2)으로 구 성 된 직선 과 x 축의 협각 이 90°일 때 dx=x2-x1=0,0 은 나 누 기 가 불가능 하기 때문에 이런 상황 을 계산 할 수 없다.
값 의 범 위 는 바로 계 산 된 각도 의 범 위 는(-pi/2,pi/2)에 있 고 좌표계 에서 볼 때 이 각도 의 범 위 는 1,4 상한 에 만 있 을 수 있 을 뿐 2,3 상한 의 각 을 표시 할 수 없다.
atan 의 부족 을 보완 하기 위해 컴퓨터 프로 그래 밍 분야 에서 atan 2 함 수 를 도 입 했 는데 그 계산 결 과 는(-π,π)에 있다.그것 은 90°의 상황 을 포함 하여 전체 좌 표를 덮 을 수 있다.
그것 의 계산 과정 은 어떤 것 입 니까?
이것 에 대하 여 나 는 위 키 백과 에서 그것 의 계산 과정 을 떼 어 냈 다.

atan 2 의 응용
첫 번 째 소절 에 있 는 그 그림 의 좌 표 는 우리 가 잘 알 고 있다.HTML,Canvas 에서 좌 표 는 우리 가 잘 아 는 좌표계 처럼 그렇지 않다.그것 은 이렇다.
x 축 에서 시계 방향 을 따라 지나 가 는 각 도 는 0,pi/2,pi,3 pi/2,2 pi 이다.
x 축 에서 시계 반대 방향 으로 지나 가 는 각 도 는 0,-pi/2,-pi,-3 pi/2,-2 pi 이다.

atan 2 의 결 과 는(-pi,pi)사이 에 마침 일주일 동안 네 개의 상한 선 이 모두 덮 여 있다.좌표계 로 볼 때 시계 방향 값 은 플러스 이 고 시계 반대 방향 값 은 마이너스 이다.
좌표계 에서 볼 때 atan 2 결 과 는(0,-pi)일 때 x 축 에서 시계 반대 방향 으로 최대 pi 라디안(180 각도)을 돌 리 는 것 을 나타 낸다.같은 이치 로(0,pi)는 x 축 에서 시계 방향 으로 최대 pi 라디안(180 각도)을 회전 하 는 것 을 나타 낸다.
1)소절 에서 atan 은 평면 좌표계 내의 임의의 두 점 의 연결선 과 x 축 정방 향 사이 의 협각 을 계산 할 수 있다 고 말 했다.한편,atan 2 는 atan 의 보충 이다.그러면 atan 2 를 사용 하면 평면 좌표계 안의 임 의 두 점 의 연결선 과 x 축 정방 향 간 의 협각 을 계산 할 수 있다.
만약 두 점 이 제1 상한 내 에 있다 면:

만약 두 점 이 제4 상한 내 에 있다 면:

만약 두 점 이 서로 다른 상한 내 에 있다 면,우리 도 평평 하 게 옮 겨 볼 수 있다.
atan 2 는 언제 사용 해 야 합 니까?
현재 나 는 두 가지 상황 을 만 났 는데,atan 2 를 통 해 해결 한 것 이다.
1)평면 좌표계 내 임의의 두 점 사이 에 화살표 가 있 는 직선 을 그린다(단 방향 화살표 일 수도 있 고 양 방향 화살표 일 수도 있다).이 수요 에서 화살표 의 한 변 과 직선 의 협각 과 화살표 의 길 이 를 알 게 되 었 다.
이 수요 의 난점 은 화살표 의 다른 두 점 좌 표를 계산 하 는 것 이다.
2)평면 좌표계 내 임의의 두 점 사이 에 지 정 된 곡률 의 곡선(arc)을 그린다.이 수요 에서 arc 를 계산 하려 면 radius,startAngle,endAngle,원심 좌 표를 알 아야 합 니 다.곡률 에 따라 반경 등 을 계산 할 수 있 지만 어 려 운 점 은 원심 좌 표를 계산 하 는 것 이다.
이 두 가지 수요 의 공 통 된 특징 은:
1)이미 알 고 있 는 두 점
2)이 두 점 과 다른 조건 에 따라 필요 한 점 좌 표를 계산한다.
현재 나 는 이 두 가지 수 요 를 만 났 는데 모두 atan 2 를 통 해 해결 되 었 다.다른 상황 은 아직 알 수 없 으 며,추 후 발견 시 보충 해 야 한다.
이 자바 스 크 립 트 는 atan 2 를 사용 하여 화살표 와 곡선 을 그 리 는 인 스 턴 스 는 바로 작은 편 이 여러분 에 게 공유 하 는 모든 내용 입 니 다.참고 하 시 기 를 바 랍 니 다.여러분 들 도 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.