2012-03-26 10 views
2

私は2本の指で写真を回転できるマルチタッチサポートを行っています。 4つのポイントがあります:前の指の場合は2、現在の指の位置の場合は2です。どのようにポイントの2つのペアの間の角度を見つけるのですか?

私は、前の2つの指を引いて新しい点を計算し、もう1つの現在の指を引いて新しい点を計算しました。

そして、私はこのような角度を計算する:

radian1 = ATAN(p1.y/p1.x)。 radian2 = atan(p2.y/p2.x);

最後の角度を得るために、radian2とradian1を減算します。

問題は画像をきれいに回転させることができますが、写真が反転した特定の位置に回転した場合などです。 270の写真が反転して90度に現れた写真。

var x1 = this.previousMousePoint.x * this.previousMousePoint2.x + this.previousMousePoint.y * this.previousMousePoint2.y; 
var y1 = this.previousMousePoint.x * this.previousMousePoint2.y - this.previousMousePoint.y * this.previousMousePoint2.x; 

var x2 = center.x * point.x + center.y * point.y; 
var y2 = center.x * point.y - center.y * point.x; 

var radian1 = Math.atan(y1/x1); 
var radian2 = Math.atan(y2/x2); 

this.anchor.matrix = this.anchor.matrix.rotate(radian2-radian1, pivot); 

OK探しています:

これは、私は以下の回答がに従って書かれているJavaScriptのです。画像を回転しようとすると少し遅くなります

+0

間違いなくこのウィキペディアのリンクをご覧ください。 http://en.wikipedia.org/wiki/Rotation_(mathematics) – Surya

答えて

1

これを行うにはきれいな方法は、(差角の正弦と余弦に比例した値を取得し、ATANを使用するために使用角度-減算式である)一度だけ:

relevant formulas: 
    cos(a2 - a1) = cos(a1)*cos(a2) + sin(a1)*sin(a2) 
    sin(a2 - a1) = cos(a1)*sin(a2) - sin(a1)*cos(a2) 

    p1.x = cos(a1) * len(p1) 
    p1.y = sin(a1) * len(p1) 

    p2.x = cos(a2) * len(p2) 
    p2.y = sin(a2) * len(p2) 

-> angle-subtraction: compute values proportional to sin and cos of (a2 - a1) 
    c12 = p1.x*p2.x + p1.y*p2.y [ = len(p1)*len(p2) * cos(a2 - a1) ] 
    s12 = p1.x*p2.y - p1.y*p2.x [ = len(p1)*len(p2) * sin(a2 - a1) ] 

-> final result: find resulting difference angle a12 [ = a2 - a1 ] 
    a12 = atan(s12/c12) 
or (if you want a full 360-degree range): 
    a12 = atan2(s12, c12) 

また、あなたがしたい場合イメージを回転させるには、(c12,s12)を角度に変換する必要はありません。最終的に、イメージ回転子は結果として得られる回転角度の正弦と余弦で行列を使用します。​​(c12,s12)によって、より直接的に使用できる(cos(a12), sin(a12))になります。

0

アークタンは0とpiの間を写像します。 270は3/2 * piに対応し、piに折り返される。開始位置と終了位置ではなく、指の位置を使って徐々に角度を見つけることをお勧めします。

実際に図を回転させない(計算を減らすことにした)場合でも、ソフトウェアが登録した傾きを示すために傾いた線/ボックス/数字を表示することができます。