fix: 旋转后缩放问题

src/components/webtopo-svgedit/components/center-panel/index.vue

@@ -281,7 +281,6 @@
           globalStore.handle_svg_info.info.client
         );
       }
-      console.log('坐标', globalStore.scale_info.symmetric_point, curPositon, new_length);
 
       //缩放
       // const move_length_x =
@@ -307,41 +306,32 @@
       //算出缩放倍数
       if (globalStore.handle_svg_info && new_length.width > 0 && new_length.height > 0) {
         const scale_x = !new_length.is_old_width
-          ? new_length.width /
+          ? new_length.width / globalStore.handle_svg_info.info.actual_bound.width
-            (globalStore.handle_svg_info.info.actual_bound.width *
-              globalStore.scale_info.scale_times.x)
           : 1;
         const scale_y = !new_length.is_old_height
-          ? new_length.height /
+          ? new_length.height / globalStore.handle_svg_info.info.actual_bound.height
-            (globalStore.handle_svg_info.info.actual_bound.height *
-              globalStore.scale_info.scale_times.y)
           : 1;
-        // const move_length_x =
+        const newCenterPoint = getCenterPoint(curPositon, globalStore.scale_info.symmetric_point);
-        //   new_length.width -
+        const move_length_x = newCenterPoint.x - globalStore.handle_svg_info.info.client.x;
-        //   globalStore.handle_svg_info.info.actual_bound.width *
+        const move_length_y = newCenterPoint.y - globalStore.handle_svg_info.info.client.y;
-        //     globalStore.scale_info.scale_times.x;
+
-        // const move_length_y =
+        if (
-        //   new_length.height -
+          scale_x > 0 &&
-        //   globalStore.handle_svg_info.info.actual_bound.height *
+          globalStore.scale_info.type !== EScaleInfoType.TopCenter &&
-        //     globalStore.scale_info.scale_times.y;
+          globalStore.scale_info.type !== EScaleInfoType.BottomCenter
-        if (scale_x > 0) {
+        ) {
           globalStore.handle_svg_info.info.scale_x = scale_x;
-          //现在是沿着中心缩放 后续这里要改下
+          globalStore.handle_svg_info.info.x =
-          // globalStore.handle_svg_info.info.x =
+            globalStore.scale_info.scale_item_info.x + move_length_x;
-          //   globalStore.scale_info.type === EScaleInfoType.TopLeft ||
-          //   globalStore.scale_info.type === EScaleInfoType.Left ||
-          //   globalStore.scale_info.type === EScaleInfoType.BottomLeft
-          //     ? globalStore.scale_info.scale_item_info.x - move_length_x / 2
-          //     : globalStore.scale_info.scale_item_info.x + move_length_x / 2;
         }
-        if (scale_y > 0) {
+        if (
+          scale_y > 0 &&
+          globalStore.scale_info.type !== EScaleInfoType.Left &&
+          globalStore.scale_info.type !== EScaleInfoType.Right
+        ) {
           globalStore.handle_svg_info.info.scale_y = scale_y;
-          // globalStore.handle_svg_info.info.y =
+          globalStore.handle_svg_info.info.y =
-          //   globalStore.scale_info.type === EScaleInfoType.TopLeft ||
+            globalStore.scale_info.scale_item_info.y + move_length_y;
-          //   globalStore.scale_info.type === EScaleInfoType.TopCenter ||
-          //   globalStore.scale_info.type === EScaleInfoType.TopRight
-          //     ? globalStore.scale_info.scale_item_info.y - move_length_y / 2
-          //     : globalStore.scale_info.scale_item_info.y + move_length_y / 2;
         }
       }
     } else if (globalStore.intention === EGlobalStoreIntention.Rotate) {

src/utils/scale-core.ts

@@ -14,7 +14,6 @@ export const calculateLeftTop = (
 ) => {
   //新的中心点坐标
   const newCenterPoint = getCenterPoint(curPositon, symmetricPoint);
-  console.log('left中心坐标', newCenterPoint);
   const newTopLeftPoint = calculateRotatedPointCoordinate(curPositon, newCenterPoint, -rotate);
   const newBottomRightPoint = calculateRotatedPointCoordinate(
     symmetricPoint,
@@ -102,19 +101,20 @@ export const calculateLeftBottom = (
     is_old_height: false
   };
 };
-
+/**
+ * 顶点中心缩放
+ * @param curPositon 按住的缩放按钮的坐标
+ * @param symmetricPoint 缩放前对称点的坐标
+ * @param rotate 旋转角度
+ * @returns
+ */
 export const calculateTop = (
   curPositon: IScalePoint,
   symmetricPoint: IScalePoint,
   rotate: number,
   curPoint: IScalePoint
 ) => {
-  // 由于用户拉伸时是以任意角度拉伸的，所以在求得旋转前的坐标时，只取 y 坐标（这里的 x 坐标可能是任意值），x 坐标用 curPoint 的。
-  // 这个中心点（第二个参数）用 curPoint, center, symmetricPoint 都可以，只要他们在一条直线上就行
   const rotatedcurPositon = calculateRotatedPointCoordinate(curPositon, curPoint, -rotate);
-  console.log('top中心坐标', rotatedcurPositon);
-
-  // 算出旋转前 y 坐标，再用 curPoint 的 x 坐标，重新计算它们旋转后对应的坐标
   const rotatedTopMiddlePoint = calculateRotatedPointCoordinate(
     {
       x: curPoint.x,
@@ -123,8 +123,6 @@ export const calculateTop = (
     curPoint,
     rotate
   );
-
-  // 用旋转后的坐标和对称点算出新的高度（勾股定理）
   const newHeight = Math.sqrt(
     (rotatedTopMiddlePoint.x - symmetricPoint.x) ** 2 +
       (rotatedTopMiddlePoint.y - symmetricPoint.y) ** 2
@@ -136,7 +134,13 @@ export const calculateTop = (
     is_old_height: false
   };
 };
-
+/**
+ * 右侧中心缩放
+ * @param curPositon 按住的缩放按钮的坐标
+ * @param symmetricPoint 缩放前对称点的坐标
+ * @param rotate 旋转角度
+ * @returns
+ */
 export const calculateRight = (
   curPositon: IScalePoint,
   symmetricPoint: IScalePoint,
@@ -165,7 +169,13 @@ export const calculateRight = (
     is_old_height: true
   };
 };
-
+/**
+ * 底部中心缩放
+ * @param curPositon 按住的缩放按钮的坐标
+ * @param symmetricPoint 缩放前对称点的坐标
+ * @param rotate 旋转角度
+ * @returns
+ */
 export const calculateBottom = (
   curPositon: IScalePoint,
   symmetricPoint: IScalePoint,
@@ -194,7 +204,13 @@ export const calculateBottom = (
     is_old_height: false
   };
 };
-
+/**
+ * 左侧中心缩放
+ * @param curPositon 按住的缩放按钮的坐标
+ * @param symmetricPoint 缩放前对称点的坐标
+ * @param rotate 旋转角度
+ * @returns
+ */
 export const calculateLeft = (
   curPositon: IScalePoint,
   symmetricPoint: IScalePoint,