From 38c0fe2e3942c3eff32f003f15e13f763d58c730 Mon Sep 17 00:00:00 2001 From: Tarrency <760216236@qq.com> Date: Thu, 19 Sep 2024 20:35:46 +0800 Subject: [PATCH 1/2] =?UTF-8?q?feat:=20=E9=85=8D=E7=BD=AE=E5=B9=B3?= =?UTF-8?q?=E7=A7=BB=E6=AD=A5=E9=95=BF=E5=92=8C=E6=89=A9=E7=BC=A9=E6=9C=80?= =?UTF-8?q?=E5=80=BC,=E8=A7=A3=E5=86=B3=E8=A7=A6=E6=8E=A7=E6=9D=BF?= =?UTF-8?q?=E7=81=B5=E6=95=8F=E5=BA=A6=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- simple-mind-map/src/constants/defaultOptions.js | 6 ++++++ simple-mind-map/src/core/event/Event.js | 5 ++++- simple-mind-map/src/core/view/View.js | 14 ++++++++------ 3 files changed, 18 insertions(+), 7 deletions(-) diff --git a/simple-mind-map/src/constants/defaultOptions.js b/simple-mind-map/src/constants/defaultOptions.js index f6ed199b..4a0bc131 100644 --- a/simple-mind-map/src/constants/defaultOptions.js +++ b/simple-mind-map/src/constants/defaultOptions.js @@ -19,6 +19,12 @@ export const defaultOpt = { themeConfig: {}, // 放大缩小的增量比例 scaleRatio: 0.2, + // 平移的步长比例 + translateRatio: 1, + // 最小缩小值，百分数 + minZoomRatio: 20, + // 最大放大值，百分数 + maxZoomRatio: 400, // 鼠标缩放是否以鼠标当前位置为中心点，否则以画布中心点 mouseScaleCenterUseMousePosition: true, // 最多显示几个标签 diff --git a/simple-mind-map/src/core/event/Event.js b/simple-mind-map/src/core/event/Event.js index 0a5f2ad5..537ff4e9 100644 --- a/simple-mind-map/src/core/event/Event.js +++ b/simple-mind-map/src/core/event/Event.js @@ -156,7 +156,10 @@ class Event extends EventEmitter { // 判断是否是触控板 let isTouchPad = false // mac、windows - if (e.wheelDeltaY === e.deltaY * -3 || Math.abs(e.wheelDeltaY) <= 10) { + // if (e.wheelDeltaY === e.deltaY * -3 || Math.abs(e.wheelDeltaY) <= 10) { + // isTouchPad = true + // } + if (Math.abs(e.deltaY) <= 50) { isTouchPad = true } this.emit('mousewheel', e, dirs, this, isTouchPad) diff --git a/simple-mind-map/src/core/view/View.js b/simple-mind-map/src/core/view/View.js index dd2f276c..9e00bb6d 100644 --- a/simple-mind-map/src/core/view/View.js +++ b/simple-mind-map/src/core/view/View.js @@ -179,8 +179,8 @@ class View { // 平移x,y方向 translateXY(x, y) { if (x === 0 && y === 0) return - this.x += x - this.y += y + this.x += x * this.mindMap.opt.translateRatio + this.y += y * this.mindMap.opt.translateRatio this.transform() this.emitEvent('translate') } @@ -188,7 +188,7 @@ class View { // 平移x方向 translateX(step) { if (step === 0) return - this.x += step + this.x += step * this.mindMap.opt.translateRatio this.transform() this.emitEvent('translate') } @@ -203,7 +203,7 @@ class View { // 平移y方向 translateY(step) { if (step === 0) return - this.y += step + this.y += step * this.mindMap.opt.translateRatio this.transform() this.emitEvent('translate') } @@ -247,7 +247,8 @@ class View { // 缩小 narrow(cx, cy, isTouchPad) { const scaleRatio = this.mindMap.opt.scaleRatio / (isTouchPad ? 5 : 1) - const scale = Math.max(this.scale - scaleRatio, 0.1) + // const scale = Math.max(this.scale - scaleRatio, 0.1) + const scale = Math.max(this.scale - scaleRatio, this.mindMap.opt.minZoomRatio / 100) this.scaleInCenter(scale, cx, cy) this.transform() this.emitEvent('scale') @@ -256,7 +257,8 @@ class View { // 放大 enlarge(cx, cy, isTouchPad) { const scaleRatio = this.mindMap.opt.scaleRatio / (isTouchPad ? 5 : 1) - const scale = this.scale + scaleRatio + // const scale = this.scale + scaleRatio + const scale = Math.min(this.scale + scaleRatio, this.mindMap.opt.maxZoomRatio / 100) this.scaleInCenter(scale, cx, cy) this.transform() this.emitEvent('scale') From 937f7d29699f9f88fbdf3777f3e7e243fcb25b9e Mon Sep 17 00:00:00 2001 From: wangqi01 <13693607080@163.com> Date: Fri, 20 Sep 2024 18:03:18 +0800 Subject: [PATCH 2/2] =?UTF-8?q?fix:=20=E9=99=90=E5=80=BC=E5=B9=B3=E7=A7=BB?= =?UTF-8?q?=E6=AD=A5=E9=95=BF=E6=AF=94=E4=BE=8B=E7=94=9F=E6=95=88=E5=8F=AA?= =?UTF-8?q?=E5=9C=A8=E9=BC=A0=E6=A0=87/=E8=A7=A6=E6=8E=A7=E6=9D=BF?= =?UTF-8?q?=E6=BB=9A=E5=8A=A8=E8=A1=8C=E4=B8=BA=E5=86=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- simple-mind-map/src/core/view/View.js | 20 +++++++++++++++----- 1 file changed, 15 insertions(+), 5 deletions(-) diff --git a/simple-mind-map/src/core/view/View.js b/simple-mind-map/src/core/view/View.js index 9e00bb6d..0093e944 100644 --- a/simple-mind-map/src/core/view/View.js +++ b/simple-mind-map/src/core/view/View.js @@ -138,7 +138,8 @@ class View { if (dirs.includes(CONSTANTS.DIR.RIGHT)) { mx = -stepX } - this.translateXY(mx, my) + // this.translateXY(mx, my) + this.translateXYwithRatio(mx, my) } }) this.mindMap.on('resize', () => { @@ -179,16 +180,25 @@ class View { // 平移x,y方向 translateXY(x, y) { if (x === 0 && y === 0) return - this.x += x * this.mindMap.opt.translateRatio - this.y += y * this.mindMap.opt.translateRatio + this.x += x + this.y += y this.transform() this.emitEvent('translate') } + // 鼠标/触控板滑动时，根据配置的平移步长比例，平移x,y方向 + translateXYwithRatio(x, y) { + if (x === 0 && y === 0) return + this.x += x * this.mindMap.opt.translateRatio + this.y += y * this.mindMap.opt.translateRatio + this.transform() + this.emitEvent('translate') + } + // 平移x方向 translateX(step) { if (step === 0) return - this.x += step * this.mindMap.opt.translateRatio + this.x += step this.transform() this.emitEvent('translate') } @@ -203,7 +213,7 @@ class View { // 平移y方向 translateY(step) { if (step === 0) return - this.y += step * this.mindMap.opt.translateRatio + this.y += step this.transform() this.emitEvent('translate') }