如何使用鼠标坐标、平移和缩放比例确定原始坐标？

Question

我会在没有特定编程语言的情况下提出这个问题。

我有一个画布控件，可以进行缩放和平移视图（拖动）。我已经在画布上加载了一张图片，我的目标是在画布上单击鼠标时获取坐标。

当我点击画布时的事件给了我鼠标的坐标 (mouse_x,mouse_y)、平移量度 (delta_x, delta_y) 和缩放 (1.0 表示不缩放, x > 1.0 表示再缩放, x

当我单击画布而不移动图像并进行缩放时，图像坐标与鼠标坐标相同。好的。

real_x = mouse_x;

real_y = mouse_y;

当我在图像移动但没有缩放的情况下单击画布时，图像坐标是添加平移度量的鼠标坐标。

real_x = mouse_x + delta_x;

real_y = mouse_y + delta_y;

问题是当我进行缩放时，我不知道使用缩放值获取原始坐标的公式是什么。

编辑：

这 3 个解决方案不起作用。

代码：

     void DrawLineOnDoubleClick(object sender, RoutedEventArgs e)
     {
        var mouse_x = this._mouseDownPos.X;
        var mouse_y = this._mouseDownPos.Y;

        var delta_x = this.TranslateX;
        var delta_y = this.TranslateY;

        var scale = this.Zoom;

        var windowwidth = 1000;
        var windowheight = 500;

        // OPTION 1. IT DOES NOT WORK
        var real_x = windowwidth / 2 - (windowwidth / 2 + delta_x) * scale + mouse_x;
        var real_y = windowheight/ 2 - (windowheight/ 2 + delta_y) * scale + mouse_y;

        // OPTION 2. IT DOES NOT WORK
        var real_x = windowwidth / 2 - windowwidth / 2 * scale + delta_x * scale + mouse_x;
        var real_y = windowheight / 2 - windowheight / 2 * scale + delta_y * scale + mouse_y;

        // OPTION 3. IT DOES NOT WORK
        var real_x = windowwidth / 2 - windowwidth / 2 * scale + delta_x * scale + mouse_x * scale;
        var real_y = windowheight / 2 - windowheight / 2 * scale + delta_y * scale + mouse_y * scale;

        // Draw line from last clicked to new clicked position
        ...
   }

例如，使用解决方案 2，当我以 0.4 的比例（缩放）单击图像的第一个角到图像的对角时，线被绘制在远离鼠标位置的位置（当我没有缩放 (1.0) 且无需平移（拖动）即可正确绘制线条。

Answer 1

我忘记发布答案了。该控件有一种方法可以为您施展魔法。

        //
        // Summary:
        //     Translates a point relative to this element to coordinates that are relative
        //     to the specified element.
        //
        // Parameters:
        //   point:
        //     The point value, as relative to this element.
        //
        //   relativeTo:
        //     The element to translate the given point into.
        //
        // Returns:
        //     A point value, now relative to the target element rather than this source
        //     element.
        public Point TranslatePoint(Point point, UIElement relativeTo);

Answer 2

我假设从图像的中心应用比例。您需要知道图像的原始大小和比例因子来计算图像的新位置。应该是这样的：

real_x = delta_x + originalWidth*(1-scale)/2 + mouse_x
real_y = delta_y + originalHeight*(1-scale)/2 + mouse_y

编辑：信息，比例原点位于窗口的中心

real_x = windowwidth/2 - (windowwidth / 2 + delta_x)*scale + mouse_x;
real_y = windowheight/2 - (windowheight / 2 + delta_y)*scale + mouse_y;

第二次编辑： 从你的截图看什么是 POS: 和 REAL？它们似乎是相同的。 我重新考虑了公式 - 虽然不确定这是你需要的：

real_x = windowwidth / 2 - windowwidth / 2 * scale + delta_x * scale + mouse x;
real_y = windowheight / 2 - windowheight / 2 * scale + delta_y * scale + mouse_y;

如果这不起作用，也许你需要使用“mouse_x * scale”和“mouse_y * scale”。

第三次编辑： 能不能这么简单：

real_x = (mouse_x + delta_x) * scale
real_y = (mouse_y + delta_y) * scale

或者也许是“/ scale”而不是“* scale”？