画布上的角位移

我有一个方形（100px x 100px），原点位于0,0（左上角）。当我移动鼠标，可以说10个像素x和y，我根据位移移动原点，然后原点变为10,10，简单。工作正常！画布上的角位移

当我旋转正方形时，我的旋转功能很好地旋转了它，但是在正方形旋转后，让我们说10度，原点应相应地移动到旋转。而现在，我不知道我必须申请的公式，以使其附加！

我是维基百科，但是我觉得它太复杂了。

http://en.wikipedia.org/wiki/Angular_displacement

和

http://en.wikipedia.org/wiki/Cosine#Sine.2C_cosine.2C_and_tangent

实施例：一个90度旋转到左边后，原点是现在的位置：左下，现在当我将鼠标移动到向右的图片上去!!!!

来源

2011-10-26 menardmam

我认为这个问题可能属于http://math.stackexchange.com/ – ewok

你是否想围绕它的中心旋转正方形？如果是这样，这个论坛帖子可能会有所帮助：http://www.gamedev.net/topic/532033-how-to-rotate-a-square-by-an-angle-image/ –

您是否试图将转换转换为将旋转的正方形上的鼠标位置转换为原始正方形上的对应点？ [这个问题]（http://stackoverflow.com/questions/2244157/reverse-java-graphics2d-scaled-and-rotated-coordinates）可能是相关的。 – finnw

假设您有一个图形，并且您想通过角度alpha将其旋转并将其翻转，以使图形的点(cx, cy)在转换后到达点(sx, sy)。

enter image description here

的变换

transformed_x = x*cos(alpha) - y*sin(alpha) + offset_x 
transformed_y = x*sin(alpha) + y*cos(alpha) + offset_y

来计算所需offset_x和offset_y值，你只需要把你的需求约(cx, cy)和(sx, sy)入上面的方程：

sx = cx*cos(alpha) - cy*sin(alpha) + offset_x 
sy = cx*sin(alpha) + cy*cos(alpha) + offset_y

和现在您可以轻松地从中提取偏移值即：

offset_x = sx - cx*cos(alpha) + cy*sin(alpha) 
offset_y = sy - cx*sin(alpha) - cy*cos(alpha)

要设置画布变换它，你只需要调用

context.translate(sx - cx*Math.cos(alpha) + cy*Math.sin(alpha), 
        sy - cx*Math.sin(alpha) - cy*Math.cos(alpha)); 
context.rotate(alpha);

你可以看到这个公式following this link有点演示。

来源

2011-10-26 21:17:11 6502

如果我正确理解您的问题，您将基于鼠标位置对矩形点应用偏移，然后旋转关于原点的结果点。

取而代之，尝试应用您的鼠标偏移后您做了轮换，而不是之前。

来源

2011-10-26 21:18:58 comingstorm

明显的答案，即不要削减，但我已经努力使其工作......没有运气！ – menardmam

画布上的角位移

回答

相关问题