마우스 이동 각도 계산 각도

Question

마우스 이동 각도를도 단위로 계산하고 싶습니다. 마우스를 직선으로 움직일 필요가 없다는 것을 알고 있지만 시작점과 끝점을 기준으로 마우스를 계산하여 멋진 직각을 만들려고했습니다.

log("ANGLE: " + getAngle(x1, y1, x2, y2)); 이상한 결과를주고있다 :

ANGLE: 0.24035975832980774 
mouse has stopped 
ANGLE: 1.334887709726425 
mouse has stopped 
ANGLE: 0.2722859857950508 
mouse has stopped 
ANGLE: 0.3715485780567732 
mouse has stopped 

코드 :

 $("canvas").mousemove(function(e) {     
      getDirection(e); 
      if (!set) { 
       x1 = e.pageX, //set starting mouse x 
       y1 = e.pageY, //set starting mouse y 
       set = true; 
      } 
      clearTimeout(thread); 
      thread = setTimeout(callback.bind(this, e), 100); 
     }); 

     function getAngle (x1, y1, x2, y2) { 
      var distY = Math.abs(y2-y1); //opposite 
      var distX = Math.abs(x2-x1); //adjacent 
      var dist = Math.sqrt((distY*distY)+(distX*distX)); //hypotenuse, 
       //don't know if there is a built in JS function to do the square of a number 
      var val = distY/dist; 
      var aSine = Math.asin(val); 
      return aSine; //return angle in degrees 
     } 

     function callback(e) { 
      x2 = e.pageX; //new X 
      y2 = e.pageY; //new Y 

      log("ANGLE: " + getAngle(x1, y1, x2, y2)); 
      log("mouse has stopped"); 
      set = false; 
     } 

Answer 1

계산이 올바르지 만 문제는 Math.asin (val)이 라디안 단위의 값을 반환한다는 것입니다.

Math.degrees = function(radians) 
{ 
    return radians*(180/Math.PI); 
} 

을 그리고 Math.degrees (Math.asin (발))를 호출하고 그 작동합니다 : 도로 변환하려면 다음 함수를 사용합니다!

Answer 2

Math.asin() 함수는 라디안 각도를 반환합니다. 180/pi을 곱하면 그 답을도로 얻을 수 있습니다.

또한 90도 이상을 필요로하므로 Math.abs 호출을 삭제하여 aSin에 음수 값을 지정할 수 있습니다.

Answer 3

전체 원의 각도를 얻기 위해 ATAN2 함수를 사용하여, 또한

radians = Math.atan2(y2-y1,x2-x1); 

, 당신은 X1, X2, Y1, 계산시 Y2의 값을 기록 할 수 있습니다, 그것은 것 마우스 위치가 추적되는 곳을 한 곳으로 만드는 것이 좋습니다. 현재 마우스를 움직일 때마다 (x2, y2, t2) 10ms마다 (x1, y1, t1) 위치를 업데이트합니다. 이로 인해 예측할 수없는 샘플 조합이 발생할 수 있습니다.