From 4d2665e15e1f8d0711e1f0aa3e886d2473ca1ebe Mon Sep 17 00:00:00 2001
From: Chen Fengyuan <chenfengyuan@outlook.com>
Date: Sun, 14 Apr 2024 19:15:53 +0800
Subject: [PATCH] refactor: change  the translateY calculation to avoid side
 effects

ref #1152
---
 packages/element-image/src/index.ts     | 10 +++++-----
 packages/element-selection/src/index.ts |  2 +-
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/packages/element-image/src/index.ts b/packages/element-image/src/index.ts
index 86ed79b3c..a4407d873 100644
--- a/packages/element-image/src/index.ts
+++ b/packages/element-image/src/index.ts
@@ -274,7 +274,7 @@ export default class CropperImage extends CropperElement {
               const moveX = x - originX;
               const moveY = y - originY;
               const translateX = ((moveX * d) - (c * moveY)) / ((a * d) - (c * b));
-              const translateY = (moveY - (b * translateX)) / d;
+              const translateY = ((moveY * a) - (b * moveX)) / ((a * d) - (c * b));
 
               /**
                * Equals to
@@ -405,7 +405,7 @@ export default class CropperImage extends CropperElement {
     if (this.translatable && isNumber(x) && isNumber(y)) {
       const [a, b, c, d] = this.$matrix;
       const e = ((x * d) - (c * y)) / ((a * d) - (c * b));
-      const f = (y - (b * e)) / d;
+      const f = ((y * a) - (b * x)) / ((a * d) - (c * b));
 
       this.$translate(e, f);
     }
@@ -423,7 +423,7 @@ export default class CropperImage extends CropperElement {
     if (this.translatable && isNumber(x) && isNumber(y)) {
       const [a, b, c, d] = this.$matrix;
       const e = ((x * d) - (c * y)) / ((a * d) - (c * b));
-      const f = (y - (b * e)) / d;
+      const f = ((y * a) - (b * x)) / ((a * d) - (c * b));
 
       this.$setTransform(a, b, c, d, e, f);
     }
@@ -455,7 +455,7 @@ export default class CropperImage extends CropperElement {
         const moveX = x - originX;
         const moveY = y - originY;
         const translateX = ((moveX * d) - (c * moveY)) / ((a * d) - (c * b));
-        const translateY = (moveY - (b * translateX)) / d;
+        const translateY = ((moveY * a) - (b * moveX)) / ((a * d) - (c * b));
 
         /**
          * Equals to
@@ -505,7 +505,7 @@ export default class CropperImage extends CropperElement {
       const moveX = x - originX;
       const moveY = y - originY;
       const translateX = ((moveX * d) - (c * moveY)) / ((a * d) - (c * b));
-      const translateY = (moveY - (b * translateX)) / d;
+      const translateY = ((moveY * a) - (b * moveX)) / ((a * d) - (c * b));
 
       /**
        * Equals to
diff --git a/packages/element-selection/src/index.ts b/packages/element-selection/src/index.ts
index 6a85f54cf..1437431d5 100644
--- a/packages/element-selection/src/index.ts
+++ b/packages/element-selection/src/index.ts
@@ -938,7 +938,7 @@ export default class CropperSelection extends CropperElement {
           const offsetX = -this.x;
           const offsetY = -this.y;
           const translateX = ((offsetX * d) - (c * offsetY)) / ((a * d) - (c * b));
-          const translateY = (offsetY - (b * translateX)) / d;
+          const translateY = ((offsetY * a) - (b * offsetX)) / ((a * d) - (c * b));
           let newE = a * translateX + c * translateY + e;
           let newF = b * translateX + d * translateY + f;
           let destWidth = image.naturalWidth;