openSourceRemote/mind-map
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 配置平移步长和扩缩最值,解决触控板灵敏度问题

Browse Source
This commit is contained in:
Tarrency 2024-09-19 20:35:46 +08:00
parent 766ce310d0
commit 38c0fe2e39
3 changed files with 18 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
simple-mind-map/src/constants/defaultOptions.js
View File

@ -19,6 +19,12 @@ export const defaultOpt = {
themeConfig: {}, themeConfig: {},
// 放大缩小的增量比例 // 放大缩小的增量比例
scaleRatio: 0.2, scaleRatio: 0.2,
// 平移的步长比例
translateRatio: 1,
// 最小缩小值，百分数
minZoomRatio: 20,
// 最大放大值，百分数
maxZoomRatio: 400,
// 鼠标缩放是否以鼠标当前位置为中心点，否则以画布中心点 // 鼠标缩放是否以鼠标当前位置为中心点，否则以画布中心点
mouseScaleCenterUseMousePosition: true, mouseScaleCenterUseMousePosition: true,
// 最多显示几个标签 // 最多显示几个标签

5
simple-mind-map/src/core/event/Event.js
View File

@ -156,7 +156,10 @@ class Event extends EventEmitter {
// 判断是否是触控板 // 判断是否是触控板
let isTouchPad = false let isTouchPad = false
// mac、windows // 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 isTouchPad = true
} }
this.emit('mousewheel', e, dirs, this, isTouchPad) this.emit('mousewheel', e, dirs, this, isTouchPad)

14
simple-mind-map/src/core/view/View.js
View File

@ -179,8 +179,8 @@ class View {
// 平移x,y方向 // 平移x,y方向
translateXY(x, y) { translateXY(x, y) {
if (x === 0 && y === 0) return if (x === 0 && y === 0) return
this.x += x this.x += x * this.mindMap.opt.translateRatio
this.y += y this.y += y * this.mindMap.opt.translateRatio
this.transform() this.transform()
this.emitEvent('translate') this.emitEvent('translate')
} }
@ -188,7 +188,7 @@ class View {
// 平移x方向 // 平移x方向
translateX(step) { translateX(step) {
if (step === 0) return if (step === 0) return
this.x += step this.x += step * this.mindMap.opt.translateRatio
this.transform() this.transform()
this.emitEvent('translate') this.emitEvent('translate')
} }
@ -203,7 +203,7 @@ class View {
// 平移y方向 // 平移y方向
translateY(step) { translateY(step) {
if (step === 0) return if (step === 0) return
this.y += step this.y += step * this.mindMap.opt.translateRatio
this.transform() this.transform()
this.emitEvent('translate') this.emitEvent('translate')
} }
@ -247,7 +247,8 @@ class View {
// 缩小 // 缩小
narrow(cx, cy, isTouchPad) { narrow(cx, cy, isTouchPad) {
const scaleRatio = this.mindMap.opt.scaleRatio / (isTouchPad ? 5 : 1) 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.scaleInCenter(scale, cx, cy)
this.transform() this.transform()
this.emitEvent('scale') this.emitEvent('scale')
@ -256,7 +257,8 @@ class View {
// 放大 // 放大
enlarge(cx, cy, isTouchPad) { enlarge(cx, cy, isTouchPad) {
const scaleRatio = this.mindMap.opt.scaleRatio / (isTouchPad ? 5 : 1) 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.scaleInCenter(scale, cx, cy)
this.transform() this.transform()
this.emitEvent('scale') this.emitEvent('scale')