From 1b6467728c0db7455dbf1b6f0288d8988ba41cb6 Mon Sep 17 00:00:00 2001
From: wanglin2 <1013335014@qq.com>
Date: Mon, 26 Jun 2023 15:57:45 +0800
Subject: [PATCH] =?UTF-8?q?Feat:=E4=BC=98=E5=8C=96=E6=8C=87=E5=AE=9A?=
 =?UTF-8?q?=E4=B8=AD=E5=BF=83=E7=82=B9=E7=BC=A9=E6=94=BE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 simple-mind-map/package.json              |  2 +-
 simple-mind-map/src/core/view/View.js     | 18 +++++++++---------
 simple-mind-map/src/plugins/TouchEvent.js | 13 +++++++------
 web/src/pages/Edit/components/Edit.vue    |  2 ++
 4 files changed, 19 insertions(+), 16 deletions(-)

diff --git a/simple-mind-map/package.json b/simple-mind-map/package.json
index f575f5fe..20d16df5 100644
--- a/simple-mind-map/package.json
+++ b/simple-mind-map/package.json
@@ -1,6 +1,6 @@
 {
   "name": "simple-mind-map",
-  "version": "0.6.3",
+  "version": "0.6.4",
   "description": "一个简单的web在线思维导图",
   "authors": [
     {
diff --git a/simple-mind-map/src/core/view/View.js b/simple-mind-map/src/core/view/View.js
index a3a12d41..3586f362 100644
--- a/simple-mind-map/src/core/view/View.js
+++ b/simple-mind-map/src/core/view/View.js
@@ -190,22 +190,22 @@ class View {
   }
 
   //  缩小
-  narrow() {
+  narrow(cx = this.mindMap.width / 2, cy = this.mindMap.height / 2) {
     let scale
     if (this.scale - this.mindMap.opt.scaleRatio > 0.1) {
       scale = this.scale - this.mindMap.opt.scaleRatio
     } else {
       scale = 0.1
     }
-    this.scaleInCenter(this.mindMap.width / 2, this.mindMap.height / 2, scale)
+    this.scaleInCenter(cx, cy, scale)
     this.transform()
     this.mindMap.emit('scale', this.scale)
   }
 
   //  放大
-  enlarge() {
+  enlarge(cx = this.mindMap.width / 2, cy = this.mindMap.height / 2) {
     const scale = this.scale + this.mindMap.opt.scaleRatio
-    this.scaleInCenter(this.mindMap.width / 2, this.mindMap.height / 2, scale)
+    this.scaleInCenter(cx, cy, scale)
     this.transform()
     this.mindMap.emit('scale', this.scale)
   }
@@ -213,11 +213,11 @@ class View {
   // 基于画布中心进行缩放
   scaleInCenter(cx, cy, scale) {
     const prevScale = this.scale
-    const dx = (cx - this.x) * (1 - scale / prevScale)
-    const dy = (cy - this.y) * (1 - scale / prevScale)
-
-    this.x += dx;
-    this.y += dy;
+    const ratio = 1 - scale / prevScale
+    const dx = (cx - this.x) * ratio
+    const dy = (cy - this.y) * ratio
+    this.x += dx
+    this.y += dy
     this.scale = scale
   }
 
diff --git a/simple-mind-map/src/plugins/TouchEvent.js b/simple-mind-map/src/plugins/TouchEvent.js
index 135d6ece..641c4f9d 100644
--- a/simple-mind-map/src/plugins/TouchEvent.js
+++ b/simple-mind-map/src/plugins/TouchEvent.js
@@ -50,16 +50,17 @@ class TouchEvent {
     } else if (len === 2) {
       let touch1 = e.touches[0]
       let touch2 = e.touches[1]
-      let distance = Math.sqrt(
-        Math.pow(touch1.clientX - touch2.clientX, 2) +
-          Math.pow(touch1.clientY - touch2.clientY, 2)
-      )
+      let ox = touch1.clientX - touch2.clientX
+      let oy = touch1.clientY - touch2.clientY
+      let distance = Math.sqrt(Math.pow(ox, 2) + Math.pow(oy, 2))
+      let cx = (touch1.clientX + touch2.clientX) / 2
+      let cy = (touch1.clientY + touch2.clientY) / 2
       if (distance > this.doubleTouchmoveDistance) {
         // 放大
-        this.mindMap.view.enlarge()
+        this.mindMap.view.enlarge(cx, cy)
       } else {
         // 缩小
-        this.mindMap.view.narrow()
+        this.mindMap.view.narrow(cx, cy)
       }
       this.doubleTouchmoveDistance = distance
     }
diff --git a/web/src/pages/Edit/components/Edit.vue b/web/src/pages/Edit/components/Edit.vue
index ad6402a0..d4e6a54f 100644
--- a/web/src/pages/Edit/components/Edit.vue
+++ b/web/src/pages/Edit/components/Edit.vue
@@ -32,6 +32,7 @@ import Drag from 'simple-mind-map/src/plugins/Drag.js'
 import Select from 'simple-mind-map/src/plugins/Select.js'
 import RichText from 'simple-mind-map/src/plugins/RichText.js'
 import AssociativeLine from 'simple-mind-map/src/plugins/AssociativeLine.js'
+import TouchEvent from 'simple-mind-map/src/plugins/TouchEvent.js'
 import Outline from './Outline'
 import Style from './Style'
 import BaseStyle from './BaseStyle'
@@ -67,6 +68,7 @@ MindMap
   .usePlugin(Export)
   .usePlugin(Select)
   .usePlugin(AssociativeLine)
+  // .usePlugin(TouchEvent)
 
 // 注册自定义主题
 // customThemeList.forEach((item) => {