Berechnen des Winkels in Grad der Mausbewegung

Question

Ich möchte den Winkel der Mausbewegung in Grad berechnen. Während ich weiß, dass Sie die Maus nicht in einer geraden Linie bewegen müssen, habe ich nur versucht, sie basierend auf Start- und Endpunkten zu berechnen, um einen schönen rechten Winkel zu erzeugen.

log("ANGLE: " + getAngle(x1, y1, x2, y2)); schenkt seltsame Ergebnisse:

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

Code:

 $("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

Ihre Berechnungen scheinen richtig zu sein, aber das Problem ist, dass Math.asin (val) Werte im Bogenmaß zurückgibt. Verwenden Sie die folgende Funktion in Grad zu konvertieren:

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

Und dann rufen Math.degrees (Math.asin (val)) und das sollte funktionieren!

Answer 2

Die Math.asin() Funktion den Winkel in Radiant zurück. Wenn Sie mit 180/pi multiplizieren, erhalten Sie die Antwort in Grad.

Zusätzlich, da Sie mehr als 90 Grad wünschen, sollten Sie den Math.abs Aufruf fallen lassen, so dass Sie einen negativen Wert für aSin haben können.

Answer 3

die atan2 Funktion können Sie einen Winkel im Kreis erhalten,

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

Zusätzlich können Sie die Werte von x1 protokollieren wollen, x2, y1, y2 zum Zeitpunkt der Berechnung, wäre es besser, nur einen Ort zu haben, an dem die Mausposition verfolgt wird. Im Moment aktualisieren Sie die Position (x2, y2, t2) alle 10ms, aber (x1, y1, t1) jedes Mal, wenn die Maus bewegt wird. Dies kann zu sehr unvorhersehbaren Probenkombinationen führen.