我正在做一些多点触控支持,允许2个手指旋转照片。有四个点:前一个手指为2个,当前手指位置为2个。
我通过减去前面两个手指来计算一个新点,第二个新点是通过减去另外两个当前手指来计算的。
然后,我像这样计算角度:
radian1 = atan(p1.y / p1.x); radian2 = atan(p2.y / p2.x);
我减去radian2和radian1以获得最终角度。
问题是我可以漂亮地旋转图像,但有时如果我旋转到某个位置,照片会被翻转,例如一张照片假设在270,但它翻转并出现在90度。
这是我根据以下回复编写的javascript:
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);
看起来不错。但是当我尝试旋转图像时它有点慢
答案 0 :(得分: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)
转换为角度,最终,您的图像旋转器将使用带有结果的正弦和余弦的矩阵旋转角度。在normalizing (c12,s12)
之后,您最终会得到(cos(a12), sin(a12))
,您可以更直接地使用它。
答案 1 :(得分:0)
0到pi之间的弧棕图。 270对应于3/2 * pi并且将折叠到pi。我建议您使用手指的位置逐步找到角度,而不仅仅是开始和结束位置。
即使您决定不实际旋转图形(以减少计算),您仍然可以显示倾斜的线/框/数字以指示软件已注册的倾斜。