javascript - JS 움직이는 자동차를 구현한다는 아이디어는 무엇입니까?

Question

제 개인적인 생각은 클릭할 때 마우스 좌표와 자동차 좌표를 구하고, 이 두 점이 이루는 직선과 X축 사이의 tan 각도를 계산하고, setInterval()을 사용하여 X-축을 늘리는 것입니다. 밀리초마다 자동차의 축 방향이 1px씩 증가하고 Y축은 (1*tan)px 증가합니다.
하지만 코드 구현에 문제가 있고 계산된 tan 값이 계속 변경됩니다.
제 생각에 문제가 있는 것인지, 코드에 문제가 있는 것인지 매우 헷갈립니다. 해당하는 참조 코드가 있으면 좋겠습니다. 구글링했는데 해결이 안되서 강사님께서 내일 아침에 제출하라고 하셨습니다. 코드는 정말 어떻게 해야할지 모르겠습니다.)
으아악

Answer 1

질문

제 개인적인 생각은 클릭할 때 마우스 좌표와 자동차 좌표를 구하고, 이 두 점이 이루는 직선과 X축 사이의 각도 tan을 계산하고, setInterval()을 사용하여 X를 늘리는 것입니다. -자동차의 축 방향을 1px씩 Y축을 밀리초마다 추가합니다. (1*tan)px;
그런데 코드 구현에 문제가 있고, 계산된 tan 값이 계속 변합니다.
제 생각에 문제가 있는 것인지, 코드에 문제가 있는 것인지 매우 헷갈립니다. 해당하는 참조 코드가 있으면 좋겠습니다. 구글링했는데 해결방법이 안 나오네요. 강사님이 내일 아침에 제출하라고 하셨습니다. 코드, 정말 어떻게 해야 할지 모르겠습니다.)

실행 가능한 코드

으아아아

Answer 2

먼저 자동차의 위치를 ​​잡은 다음 마우스 포인트 아래의 clienX 위치를 가져오고 이 clientX를 사용하여 자동차의 $('#car')offset().left를 빼고 양수 값과 음수 값을 기준으로 방향을 결정하고 결정합니다. 절대값을 기준으로 거리를 수정한 후 차의 왼쪽 부분만 수정하면 됩니다

Answer 3

이렇게 화려한 공식을 사용할 필요는 없습니다. 속도에 시간을 곱하여 각 움직임의 거리를 구하세요.
Current x, y
Target x', y'
Speed ​​​v
Time to target t= (x'- x)/v
간격 시간 간격 dT
다음 위치 다음 x" = x + dT*v, y"=..
간격에서 위치를 x", y"로 이동하면 됩니다

Answer 4

논리는 괜찮아 보이지만 방향과 X축 사이의 각도의 tan을 계산하려면 다음과 같아야 합니다.

으아아아

맞아 거꾸로 썼구나...