From af3d727a64317defdde0e3dde2517abd4d3f85a4 Mon Sep 17 00:00:00 2001 From: sunmeng Date: Thu, 21 Aug 2025 09:11:09 +0800 Subject: [PATCH] fix --- pages/index/gesture-canvas-page.vue | 30 +++++-- pages/index/gesture-handler.js | 78 ++++++++++++------- pages/index/transform-canvas.vue | 16 +++- .../pages/index/gesture-canvas-page.js.map | 2 +- .../pages/index/gesture-handler.js.map | 2 +- .../pages/index/transform-canvas.js.map | 2 +- unpackage/dist/dev/mp-weixin/common/vendor.js | 2 +- .../pages/index/gesture-canvas-page.js | 27 +++++-- .../mp-weixin/pages/index/gesture-handler.js | 73 ++++++++++------- .../mp-weixin/pages/index/transform-canvas.js | 14 +++- 10 files changed, 172 insertions(+), 74 deletions(-) diff --git a/pages/index/gesture-canvas-page.vue b/pages/index/gesture-canvas-page.vue index f85e7a3..b7e3379 100644 --- a/pages/index/gesture-canvas-page.vue +++ b/pages/index/gesture-canvas-page.vue @@ -79,7 +79,8 @@ export default { methods: { handleCanvasClick(e) { if (!this.containerRect) return; - + // 如果是移动操作则忽略点击 + if (this.isMoving) return; // 获取dpr const dpr = this.$refs.canvasRef.dpr || 1; @@ -260,11 +261,30 @@ export default { // console.log(event,'handleTouchEvent') // 更新触点数量 this.touchPoints = event.touches.length; - + // 增加移动状态检测 + if (event.type === 'touchstart') { + this.lastTouchTime = Date.now(); + this.touchStartPoint = { + x: event.touches[0].clientX, + y: event.touches[0].clientY + }; + this.isMoving = false; // 重置移动状态 + } + else if (event.type === 'touchmove') { + // 检测移动距离是否超过阈值 + if (this.touchStartPoint) { + const dx = Math.abs(event.touches[0].clientX - this.touchStartPoint.x); + const dy = Math.abs(event.touches[0].clientY - this.touchStartPoint.y); + if (dx > 5 || dy > 5) { + this.isMoving = true; + } + } + } + // 仅在触摸开始时重置状态 - if (event.type === 'touchstart') { - this.gestureStatus = event.touches.length > 1 ? '双指开始' : '单指开始'; - } + // if (event.type === 'touchstart') { + // this.gestureStatus = event.touches.length > 1 ? '双指开始' : '单指开始'; + // } // 处理事件传递 this.gestureHandler?.catchEvent(event); diff --git a/pages/index/gesture-handler.js b/pages/index/gesture-handler.js index cc7c6fc..c364d91 100644 --- a/pages/index/gesture-handler.js +++ b/pages/index/gesture-handler.js @@ -199,40 +199,66 @@ class GestureHandler { } // 基础缩放手势处理 - _handlePinch(touches) { - const point1 = touches[0]; - const point2 = touches[1]; + // _handlePinch(touches) { + // const point1 = touches[0]; + // const point2 = touches[1]; - const getPoint = (touch) => ({ - x: touch.x || (touch.clientX - this.containerRect.left), - y: touch.y || (t.clientY - this.containerRect.top) - }); + // const getPoint = (touch) => ({ + // x: touch.x || (touch.clientX - this.containerRect.left), + // y: touch.y || (t.clientY - this.containerRect.top) + // }); - const currentPoints = [getPoint(point1), getPoint(point2)]; + // const currentPoints = [getPoint(point1), getPoint(point2)]; - if (this.lastPoints) { - const currentDistance = Math.sqrt( - Math.pow(currentPoints[1].x - currentPoints[0].x, 2) + - Math.pow(currentPoints[1].y - currentPoints[0].y, 2) - ); + // if (this.lastPoints) { + // const currentDistance = Math.sqrt( + // Math.pow(currentPoints[1].x - currentPoints[0].x, 2) + + // Math.pow(currentPoints[1].y - currentPoints[0].y, 2) + // ); - const prevDistance = Math.sqrt( - Math.pow(this.lastPoints[1].x - this.lastPoints[0].x, 2) + - Math.pow(this.lastPoints[1].y - this.lastPoints[0].y, 2) - ); + // const prevDistance = Math.sqrt( + // Math.pow(this.lastPoints[1].x - this.lastPoints[0].x, 2) + + // Math.pow(this.lastPoints[1].y - this.lastPoints[0].y, 2) + // ); - if (prevDistance > 0 && currentDistance > 0) { - const scaleChange = currentDistance / prevDistance; + // if (prevDistance > 0 && currentDistance > 0) { + // const scaleChange = currentDistance / prevDistance; - const centerX = (currentPoints[0].x + currentPoints[1].x) / 2; - const centerY = (currentPoints[0].y + currentPoints[1].y) / 2; + // const centerX = (currentPoints[0].x + currentPoints[1].x) / 2; + // const centerY = (currentPoints[0].y + currentPoints[1].y) / 2; - this.transformMatrix.scale(scaleChange, scaleChange, centerX, centerY); - } - } + // this.transformMatrix.scale(scaleChange, scaleChange, centerX, centerY); + // } + // } - this.lastPoints = currentPoints; - } + // this.lastPoints = currentPoints; + // } + + _handlePinch(touches) { + if (touches.length < 2) return; + + // 获取当前两点位置 + const currentDistance = this.calculateDistance(touches); + + if (this.lastPinchDistance && currentDistance) { + const scaleChange = currentDistance / this.lastPinchDistance; + + // 计算中心点 + const centerX = (touches[0].clientX + touches[1].clientX) / 2; + const centerY = (touches[0].clientY + touches[1].clientY) / 2; + + // 应用缩放 + this.transformMatrix.scale(scaleChange, scaleChange, centerX, centerY); + } + + this.lastPinchDistance = currentDistance; + } + + calculateDistance(touches) { + const dx = touches[0].clientX - touches[1].clientX; + const dy = touches[0].clientY - touches[1].clientY; + return Math.sqrt(dx * dx + dy * dy); + } } export default GestureHandler; \ No newline at end of file diff --git a/pages/index/transform-canvas.vue b/pages/index/transform-canvas.vue index bec1d16..fca8947 100644 --- a/pages/index/transform-canvas.vue +++ b/pages/index/transform-canvas.vue @@ -94,10 +94,20 @@ export default { }, methods: { + // 修正坐标转换方法 invertPoint(x, y) { - // 注意：直接使用矩阵的逆转换，不需要除以dpr - const inverted = this.matrix.invertPoint(x, y); - return inverted; + const det = this.matrix.a * this.matrix.d - this.matrix.b * this.matrix.c; + return { + x: (this.matrix.d * x - this.matrix.c * y - + this.matrix.d * this.matrix.tx + this.matrix.c * this.matrix.ty) / det, + y: (-this.matrix.b * x + this.matrix.a * y + + this.matrix.b * this.matrix.tx - this.matrix.a * this.matrix.ty) / det + }; + }, + + // 添加移动速度检查 + shouldIgnoreClick() { + return Date.now() - this.lastTouchTime < 300; }, // 添加点击检测方法 diff --git a/unpackage/dist/dev/.sourcemap/mp-weixin/pages/index/gesture-canvas-page.js.map b/unpackage/dist/dev/.sourcemap/mp-weixin/pages/index/gesture-canvas-page.js.map index 86c6898..ce0312c 100644 --- a/unpackage/dist/dev/.sourcemap/mp-weixin/pages/index/gesture-canvas-page.js.map +++ b/unpackage/dist/dev/.sourcemap/mp-weixin/pages/index/gesture-canvas-page.js.map @@ -1 +1 @@ -{"version":3,"file":"gesture-canvas-page.js","sources":["pages/index/gesture-canvas-page.vue?type=page"],"sourcesContent":["import MiniProgramPage from '/Users/sunmeng/Desktop/wx/canvas/pages/index/gesture-canvas-page.vue'\nwx.createPage(MiniProgramPage)"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,GAAG,WAAW,eAAe;"} \ No newline at end of file +{"version":3,"file":"gesture-canvas-page.js","sources":["pages/index/gesture-canvas-page.vue?type=page"],"sourcesContent":["import MiniProgramPage from '/Users/sunmeng/Desktop/wx/canvas/pages/index/gesture-canvas-page.vue'\nwx.createPage(MiniProgramPage)"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,GAAG,WAAW,eAAe;"} \ No newline at end of file diff --git a/unpackage/dist/dev/.sourcemap/mp-weixin/pages/index/gesture-handler.js.map b/unpackage/dist/dev/.sourcemap/mp-weixin/pages/index/gesture-handler.js.map index 44eb7a5..ee25178 100644 --- a/unpackage/dist/dev/.sourcemap/mp-weixin/pages/index/gesture-handler.js.map +++ b/unpackage/dist/dev/.sourcemap/mp-weixin/pages/index/gesture-handler.js.map @@ -1 +1 @@ -{"version":3,"file":"gesture-handler.js","sources":["pages/index/gesture-handler.js"],"sourcesContent":["class GestureHandler {\n constructor(context, transformMatrix, { container }) {\n this.transformMatrix = transformMatrix;\n this.containerRect = container;\n this.panThreshold = 5;\n this.panStarted = false;\n\t\t// 保存父组件上下文\n\t\tthis.context = context;\n // 判断是否是小程序环境\n this.isMiniProgram = typeof wx !== 'undefined' || typeof uni !== 'undefined';\n \n // 小程序环境下直接使用降级方案\n if (this.isMiniProgram) {\n console.log('小程序环境，使用降级手势处理器');\n this.catchEvent = this.createSimpleGestureHandler();\n return;\n }\n \n // 非小程序环境尝试使用AnyTouch\n try {\n const atOptions = {\n getPoint: touch => ({\n x: touch.clientX - this.containerRect.left,\n y: touch.clientY - this.containerRect.top\n }),\n preventDefault: false\n };\n \n // 提供兼容小程序的虚拟元素\n atOptions.element = {\n style: {},\n addEventListener: () => {},\n removeEventListener: () => {},\n ownerDocument: {\n documentElement: {\n style: {}\n }\n }\n };\n \n // 动态导入AnyTouch避免小程序环境问题\n import('any-touch').then(AnyTouch => {\n this.at = new AnyTouch.default(atOptions);\n this.setupGestures();\n console.log('AnyTouch手势处理器已初始化');\n }).catch(e => {\n console.error('AnyTouch加载失败:', e);\n this.catchEvent = this.createSimpleGestureHandler();\n });\n } catch (e) {\n console.error('AnyTouch初始化失败:', e);\n this.catchEvent = this.createSimpleGestureHandler();\n }\n }\n \n createSimpleGestureHandler() {\n let isClick = true;\n let startPoint = null;\n let startTime = null;\n let lastPoint = null;\n \n return (event) => {\n // 移除了视图判断\n const touches = event.touches || [];\n \n if (touches.length === 1) {\n const getPoint = (t) => ({\n x: t.x || (t.clientX - this.containerRect.left),\n y: t.y || (t.clientY - this.containerRect.top)\n });\n \n const currentPoint = getPoint(touches[0]);\n \n if (!startPoint) {\n startPoint = currentPoint;\n startTime = Date.now();\n }\n \n const dx = currentPoint.x - startPoint.x;\n const dy = currentPoint.y - startPoint.y;\n const distance = Math.sqrt(dx * dx + dy * dy);\n \n // 区分点击和拖拽\n if (isClick && distance < 5 && Date.now() - startTime < 200) {\n return;\n }\n \n isClick = false;\n \n if (lastPoint) {\n const moveDx = currentPoint.x - lastPoint.x;\n const moveDy = currentPoint.y - lastPoint.y;\n \n this.transformMatrix.tx += moveDx;\n this.transformMatrix.ty += moveDy;\n }\n \n lastPoint = currentPoint;\n } else if (touches.length > 1) {\n this._handlePinch(touches);\n }\n \n // 重置状态\n if (event.type === 'touchend' || event.type === 'touchcancel') {\n isClick = true;\n startPoint = null;\n startTime = null;\n lastPoint = null;\n }\n };\n }\n \n \n setupGestures() {\n // 平移手势\n this.at.on('pan', (event) => {\n if (event.type === 'panstart') {\n this.panStarted = false;\n }\n else if (event.type === 'panmove') {\n\t\t\t\tconsole.log('移动')\n const distance = Math.sqrt(event.deltaX**2 + event.deltaY**2);\n \n if (!this.panStarted && distance < this.panThreshold) return;\n \n if (!this.panStarted) {\n this.panStarted = true;\n }\n \n const currentScale = Math.sqrt(\n this.transformMatrix.a * this.transformMatrix.a +\n this.transformMatrix.b * this.transformMatrix.b\n );\n \n const dx = event.deltaX / currentScale;\n const dy = event.deltaY / currentScale;\n \n this.transformMatrix.translate(dx, dy);\n } else if (event.type === 'panend') {\n this.panStarted = false;\n }\n });\n \n // 缩放手势\n this.at.on('pinch', (event) => {\n if (event.type === 'pinchstart') {\n this.lastScale = 1;\n }\n else if (event.type === 'pinchmove') {\n const scaleChange = event.scale / this.lastScale;\n this.lastScale = event.scale;\n \n const centerX = event.center.x;\n const centerY = event.center.y;\n \n this.transformMatrix.scale(scaleChange, scaleChange, centerX, centerY);\n }\n });\n }\n \n // 公共接口\n catchEvent(event) {\n\t\t// 当触摸点数量变化时终止当前手势\n\t\tif (this.lastTouchCount !== event.touches.length) {\n\t\t\tthis.panStarted = false;\n\t\t\tthis.lastPoints = null;\n\t\t}\n\t\tthis.lastTouchCount = event.touches.length;\n\t\t\n try {\n if (this.at) {\n this.at.run(event);\n } else if (this.catchEvent) {\n this.catchEvent(event);\n }\n } catch (e) {\n console.error('手势处理错误:', e);\n }\n }\n \n // 基础平移手势处理\n _handlePan(touch) {\n const getPoint = (t) => ({\n x: t.x || (t.clientX - this.containerRect.left),\n y: t.y || (t.clientY - this.containerRect.top)\n });\n \n const currentPoint = getPoint(touch);\n \n if (this.lastPoint) {\n const dx = currentPoint.x - this.lastPoint.x;\n const dy = currentPoint.y - this.lastPoint.y;\n \n this.transformMatrix.tx += dx;\n this.transformMatrix.ty += dy;\n }\n \n this.lastPoint = currentPoint;\n }\n \n // 基础缩放手势处理\n _handlePinch(touches) {\n const point1 = touches[0];\n const point2 = touches[1];\n \n const getPoint = (touch) => ({\n x: touch.x || (touch.clientX - this.containerRect.left),\n y: touch.y || (t.clientY - this.containerRect.top)\n });\n \n const currentPoints = [getPoint(point1), getPoint(point2)];\n \n if (this.lastPoints) {\n const currentDistance = Math.sqrt(\n Math.pow(currentPoints[1].x - currentPoints[0].x, 2) + \n Math.pow(currentPoints[1].y - currentPoints[0].y, 2)\n );\n \n const prevDistance = Math.sqrt(\n Math.pow(this.lastPoints[1].x - this.lastPoints[0].x, 2) + \n Math.pow(this.lastPoints[1].y - this.lastPoints[0].y, 2)\n );\n \n if (prevDistance > 0 && currentDistance > 0) {\n const scaleChange = currentDistance / prevDistance;\n \n const centerX = (currentPoints[0].x + currentPoints[1].x) / 2;\n const centerY = (currentPoints[0].y + currentPoints[1].y) / 2;\n \n this.transformMatrix.scale(scaleChange, scaleChange, centerX, centerY);\n }\n }\n \n this.lastPoints = currentPoints;\n }\n}\n\nexport default GestureHandler;"],"names":["wx","uni","t"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"gesture-handler.js","sources":["pages/index/gesture-handler.js"],"sourcesContent":["class GestureHandler {\n constructor(context, transformMatrix, { container }) {\n this.transformMatrix = transformMatrix;\n this.containerRect = container;\n this.panThreshold = 5;\n this.panStarted = false;\n\t\t// 保存父组件上下文\n\t\tthis.context = context;\n // 判断是否是小程序环境\n this.isMiniProgram = typeof wx !== 'undefined' || typeof uni !== 'undefined';\n \n // 小程序环境下直接使用降级方案\n if (this.isMiniProgram) {\n console.log('小程序环境，使用降级手势处理器');\n this.catchEvent = this.createSimpleGestureHandler();\n return;\n }\n \n // 非小程序环境尝试使用AnyTouch\n try {\n const atOptions = {\n getPoint: touch => ({\n x: touch.clientX - this.containerRect.left,\n y: touch.clientY - this.containerRect.top\n }),\n preventDefault: false\n };\n \n // 提供兼容小程序的虚拟元素\n atOptions.element = {\n style: {},\n addEventListener: () => {},\n removeEventListener: () => {},\n ownerDocument: {\n documentElement: {\n style: {}\n }\n }\n };\n \n // 动态导入AnyTouch避免小程序环境问题\n import('any-touch').then(AnyTouch => {\n this.at = new AnyTouch.default(atOptions);\n this.setupGestures();\n console.log('AnyTouch手势处理器已初始化');\n }).catch(e => {\n console.error('AnyTouch加载失败:', e);\n this.catchEvent = this.createSimpleGestureHandler();\n });\n } catch (e) {\n console.error('AnyTouch初始化失败:', e);\n this.catchEvent = this.createSimpleGestureHandler();\n }\n }\n \n createSimpleGestureHandler() {\n let isClick = true;\n let startPoint = null;\n let startTime = null;\n let lastPoint = null;\n \n return (event) => {\n // 移除了视图判断\n const touches = event.touches || [];\n \n if (touches.length === 1) {\n const getPoint = (t) => ({\n x: t.x || (t.clientX - this.containerRect.left),\n y: t.y || (t.clientY - this.containerRect.top)\n });\n \n const currentPoint = getPoint(touches[0]);\n \n if (!startPoint) {\n startPoint = currentPoint;\n startTime = Date.now();\n }\n \n const dx = currentPoint.x - startPoint.x;\n const dy = currentPoint.y - startPoint.y;\n const distance = Math.sqrt(dx * dx + dy * dy);\n \n // 区分点击和拖拽\n if (isClick && distance < 5 && Date.now() - startTime < 200) {\n return;\n }\n \n isClick = false;\n \n if (lastPoint) {\n const moveDx = currentPoint.x - lastPoint.x;\n const moveDy = currentPoint.y - lastPoint.y;\n \n this.transformMatrix.tx += moveDx;\n this.transformMatrix.ty += moveDy;\n }\n \n lastPoint = currentPoint;\n } else if (touches.length > 1) {\n this._handlePinch(touches);\n }\n \n // 重置状态\n if (event.type === 'touchend' || event.type === 'touchcancel') {\n isClick = true;\n startPoint = null;\n startTime = null;\n lastPoint = null;\n }\n };\n }\n \n \n setupGestures() {\n // 平移手势\n this.at.on('pan', (event) => {\n if (event.type === 'panstart') {\n this.panStarted = false;\n }\n else if (event.type === 'panmove') {\n\t\t\t\tconsole.log('移动')\n const distance = Math.sqrt(event.deltaX**2 + event.deltaY**2);\n \n if (!this.panStarted && distance < this.panThreshold) return;\n \n if (!this.panStarted) {\n this.panStarted = true;\n }\n \n const currentScale = Math.sqrt(\n this.transformMatrix.a * this.transformMatrix.a +\n this.transformMatrix.b * this.transformMatrix.b\n );\n \n const dx = event.deltaX / currentScale;\n const dy = event.deltaY / currentScale;\n \n this.transformMatrix.translate(dx, dy);\n } else if (event.type === 'panend') {\n this.panStarted = false;\n }\n });\n \n // 缩放手势\n this.at.on('pinch', (event) => {\n if (event.type === 'pinchstart') {\n this.lastScale = 1;\n }\n else if (event.type === 'pinchmove') {\n const scaleChange = event.scale / this.lastScale;\n this.lastScale = event.scale;\n \n const centerX = event.center.x;\n const centerY = event.center.y;\n \n this.transformMatrix.scale(scaleChange, scaleChange, centerX, centerY);\n }\n });\n }\n \n // 公共接口\n catchEvent(event) {\n\t\t// 当触摸点数量变化时终止当前手势\n\t\tif (this.lastTouchCount !== event.touches.length) {\n\t\t\tthis.panStarted = false;\n\t\t\tthis.lastPoints = null;\n\t\t}\n\t\tthis.lastTouchCount = event.touches.length;\n\t\t\n try {\n if (this.at) {\n this.at.run(event);\n } else if (this.catchEvent) {\n this.catchEvent(event);\n }\n } catch (e) {\n console.error('手势处理错误:', e);\n }\n }\n \n // 基础平移手势处理\n _handlePan(touch) {\n const getPoint = (t) => ({\n x: t.x || (t.clientX - this.containerRect.left),\n y: t.y || (t.clientY - this.containerRect.top)\n });\n \n const currentPoint = getPoint(touch);\n \n if (this.lastPoint) {\n const dx = currentPoint.x - this.lastPoint.x;\n const dy = currentPoint.y - this.lastPoint.y;\n \n this.transformMatrix.tx += dx;\n this.transformMatrix.ty += dy;\n }\n \n this.lastPoint = currentPoint;\n }\n \n // 基础缩放手势处理\n // _handlePinch(touches) {\n // const point1 = touches[0];\n // const point2 = touches[1];\n \n // const getPoint = (touch) => ({\n // x: touch.x || (touch.clientX - this.containerRect.left),\n // y: touch.y || (t.clientY - this.containerRect.top)\n // });\n \n // const currentPoints = [getPoint(point1), getPoint(point2)];\n \n // if (this.lastPoints) {\n // const currentDistance = Math.sqrt(\n // Math.pow(currentPoints[1].x - currentPoints[0].x, 2) + \n // Math.pow(currentPoints[1].y - currentPoints[0].y, 2)\n // );\n \n // const prevDistance = Math.sqrt(\n // Math.pow(this.lastPoints[1].x - this.lastPoints[0].x, 2) + \n // Math.pow(this.lastPoints[1].y - this.lastPoints[0].y, 2)\n // );\n \n // if (prevDistance > 0 && currentDistance > 0) {\n // const scaleChange = currentDistance / prevDistance;\n \n // const centerX = (currentPoints[0].x + currentPoints[1].x) / 2;\n // const centerY = (currentPoints[0].y + currentPoints[1].y) / 2;\n \n // this.transformMatrix.scale(scaleChange, scaleChange, centerX, centerY);\n // }\n // }\n \n // this.lastPoints = currentPoints;\n // }\n\n\t_handlePinch(touches) {\n\t if (touches.length < 2) return;\n\t \n\t // 获取当前两点位置\n\t const currentDistance = this.calculateDistance(touches);\n\t \n\t if (this.lastPinchDistance && currentDistance) {\n\t const scaleChange = currentDistance / this.lastPinchDistance;\n\t \n\t // 计算中心点\n\t const centerX = (touches[0].clientX + touches[1].clientX) / 2;\n\t const centerY = (touches[0].clientY + touches[1].clientY) / 2;\n\t \n\t // 应用缩放\n\t this.transformMatrix.scale(scaleChange, scaleChange, centerX, centerY);\n\t }\n\t \n\t this.lastPinchDistance = currentDistance;\n\t}\n\t\n\tcalculateDistance(touches) {\n\t const dx = touches[0].clientX - touches[1].clientX;\n\t const dy = touches[0].clientY - touches[1].clientY;\n\t return Math.sqrt(dx * dx + dy * dy);\n\t}\n}\n\nexport default GestureHandler;"],"names":["wx","uni"],"mappings":"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"} \ No newline at end of file diff --git a/unpackage/dist/dev/.sourcemap/mp-weixin/pages/index/transform-canvas.js.map b/unpackage/dist/dev/.sourcemap/mp-weixin/pages/index/transform-canvas.js.map index e83cc35..0d5f515 100644 --- a/unpackage/dist/dev/.sourcemap/mp-weixin/pages/index/transform-canvas.js.map +++ b/unpackage/dist/dev/.sourcemap/mp-weixin/pages/index/transform-canvas.js.map @@ -1 +1 @@ -{"version":3,"file":"transform-canvas.js","sources":["/Users/sunmeng/Desktop/wx/canvas/pages/index/transform-canvas.vue?type=component"],"sourcesContent":["import Component from '/Users/sunmeng/Desktop/wx/canvas/pages/index/transform-canvas.vue'\nwx.createComponent(Component)"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,GAAG,gBAAgB,SAAS;"} \ No newline at end of file +{"version":3,"file":"transform-canvas.js","sources":["/Users/sunmeng/Desktop/wx/canvas/pages/index/transform-canvas.vue?type=component"],"sourcesContent":["import Component from '/Users/sunmeng/Desktop/wx/canvas/pages/index/transform-canvas.vue'\nwx.createComponent(Component)"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,GAAG,gBAAgB,SAAS;"} \ No newline at end of file diff --git a/unpackage/dist/dev/mp-weixin/common/vendor.js b/unpackage/dist/dev/mp-weixin/common/vendor.js index ee9ca09..4429373 100644 --- a/unpackage/dist/dev/mp-weixin/common/vendor.js +++ b/unpackage/dist/dev/mp-weixin/common/vendor.js @@ -6882,7 +6882,7 @@ function initOnError() { function initRuntimeSocketService() { const hosts = "127.0.0.1,172.10.0.127"; const port = "8090"; - const id = "mp-weixin_05amPE"; + const id = "mp-weixin_Z8uiV9"; const lazy = typeof swan !== "undefined"; let restoreError = lazy ? () => { } : initOnError(); diff --git a/unpackage/dist/dev/mp-weixin/pages/index/gesture-canvas-page.js b/unpackage/dist/dev/mp-weixin/pages/index/gesture-canvas-page.js index 1a60d5b..7c2c888 100644 --- a/unpackage/dist/dev/mp-weixin/pages/index/gesture-canvas-page.js +++ b/unpackage/dist/dev/mp-weixin/pages/index/gesture-canvas-page.js @@ -41,6 +41,8 @@ const _sfc_main = { handleCanvasClick(e) { if (!this.containerRect) return; + if (this.isMoving) + return; const dpr = this.$refs.canvasRef.dpr || 1; const x = (e.detail.x - this.containerRect.left) * dpr; const y = (e.detail.y - this.containerRect.top) * dpr; @@ -63,7 +65,7 @@ const _sfc_main = { } else if (this.currentView === "seat") { const hitSeat = this.$refs.canvasRef.checkSeatHit(x, y); if (hitSeat) { - common_vendor.index.__f__("log", "at pages/index/gesture-canvas-page.vue:111", "选中座位:", hitSeat); + common_vendor.index.__f__("log", "at pages/index/gesture-canvas-page.vue:112", "选中座位:", hitSeat); this.toggleSeatSelection(hitSeat); } } @@ -110,7 +112,7 @@ const _sfc_main = { return; } } catch (e) { - common_vendor.index.__f__("error", "at pages/index/gesture-canvas-page.vue:171", "获取容器位置失败:", e); + common_vendor.index.__f__("error", "at pages/index/gesture-canvas-page.vue:172", "获取容器位置失败:", e); } await new Promise((r) => setTimeout(r, 100)); retryCount++; @@ -122,7 +124,7 @@ const _sfc_main = { container: this.containerRect }); } catch (e) { - common_vendor.index.__f__("error", "at pages/index/gesture-canvas-page.vue:187", "手势处理器初始化失败:", e); + common_vendor.index.__f__("error", "at pages/index/gesture-canvas-page.vue:188", "手势处理器初始化失败:", e); this.gestureHandler = { catchEvent: this.createGestureFallback(), setScale: (scale) => { @@ -180,7 +182,20 @@ const _sfc_main = { var _a; this.touchPoints = event.touches.length; if (event.type === "touchstart") { - this.gestureStatus = event.touches.length > 1 ? "双指开始" : "单指开始"; + this.lastTouchTime = Date.now(); + this.touchStartPoint = { + x: event.touches[0].clientX, + y: event.touches[0].clientY + }; + this.isMoving = false; + } else if (event.type === "touchmove") { + if (this.touchStartPoint) { + const dx = Math.abs(event.touches[0].clientX - this.touchStartPoint.x); + const dy = Math.abs(event.touches[0].clientY - this.touchStartPoint.y); + if (dx > 5 || dy > 5) { + this.isMoving = true; + } + } } (_a = this.gestureHandler) == null ? void 0 : _a.catchEvent(event); if (event.type === "touchend" || event.type === "touchcancel") { @@ -528,7 +543,7 @@ const _sfc_main = { }; this.seatAreas = response.data; } catch (e) { - common_vendor.index.__f__("error", "at pages/index/gesture-canvas-page.vue:627", "加载区域数据失败:", e); + common_vendor.index.__f__("error", "at pages/index/gesture-canvas-page.vue:647", "加载区域数据失败:", e); } }, async loadSeatData(areaCode) { @@ -567,7 +582,7 @@ const _sfc_main = { } }); } catch (e) { - common_vendor.index.__f__("error", "at pages/index/gesture-canvas-page.vue:685", "加载座位数据失败:", e); + common_vendor.index.__f__("error", "at pages/index/gesture-canvas-page.vue:705", "加载座位数据失败:", e); common_vendor.index.showToast({ title: "加载座位失败", icon: "none" }); } } diff --git a/unpackage/dist/dev/mp-weixin/pages/index/gesture-handler.js b/unpackage/dist/dev/mp-weixin/pages/index/gesture-handler.js index 0b01284..e57ca79 100644 --- a/unpackage/dist/dev/mp-weixin/pages/index/gesture-handler.js +++ b/unpackage/dist/dev/mp-weixin/pages/index/gesture-handler.js @@ -54,9 +54,9 @@ class GestureHandler { return (event) => { const touches = event.touches || []; if (touches.length === 1) { - const getPoint = (t2) => ({ - x: t2.x || t2.clientX - this.containerRect.left, - y: t2.y || t2.clientY - this.containerRect.top + const getPoint = (t) => ({ + x: t.x || t.clientX - this.containerRect.left, + y: t.y || t.clientY - this.containerRect.top }); const currentPoint = getPoint(touches[0]); if (!startPoint) { @@ -141,9 +141,9 @@ class GestureHandler { } // 基础平移手势处理 _handlePan(touch) { - const getPoint = (t2) => ({ - x: t2.x || t2.clientX - this.containerRect.left, - y: t2.y || t2.clientY - this.containerRect.top + const getPoint = (t) => ({ + x: t.x || t.clientX - this.containerRect.left, + y: t.y || t.clientY - this.containerRect.top }); const currentPoint = getPoint(touch); if (this.lastPoint) { @@ -155,29 +155,48 @@ class GestureHandler { this.lastPoint = currentPoint; } // 基础缩放手势处理 + // _handlePinch(touches) { + // const point1 = touches[0]; + // const point2 = touches[1]; + // const getPoint = (touch) => ({ + // x: touch.x || (touch.clientX - this.containerRect.left), + // y: touch.y || (t.clientY - this.containerRect.top) + // }); + // const currentPoints = [getPoint(point1), getPoint(point2)]; + // if (this.lastPoints) { + // const currentDistance = Math.sqrt( + // Math.pow(currentPoints[1].x - currentPoints[0].x, 2) + + // Math.pow(currentPoints[1].y - currentPoints[0].y, 2) + // ); + // const prevDistance = Math.sqrt( + // Math.pow(this.lastPoints[1].x - this.lastPoints[0].x, 2) + + // Math.pow(this.lastPoints[1].y - this.lastPoints[0].y, 2) + // ); + // if (prevDistance > 0 && currentDistance > 0) { + // const scaleChange = currentDistance / prevDistance; + // const centerX = (currentPoints[0].x + currentPoints[1].x) / 2; + // const centerY = (currentPoints[0].y + currentPoints[1].y) / 2; + // this.transformMatrix.scale(scaleChange, scaleChange, centerX, centerY); + // } + // } + // this.lastPoints = currentPoints; + // } _handlePinch(touches) { - const point1 = touches[0]; - const point2 = touches[1]; - const getPoint = (touch) => ({ - x: touch.x || touch.clientX - this.containerRect.left, - y: touch.y || t.clientY - this.containerRect.top - }); - const currentPoints = [getPoint(point1), getPoint(point2)]; - if (this.lastPoints) { - const currentDistance = Math.sqrt( - Math.pow(currentPoints[1].x - currentPoints[0].x, 2) + Math.pow(currentPoints[1].y - currentPoints[0].y, 2) - ); - const prevDistance = Math.sqrt( - Math.pow(this.lastPoints[1].x - this.lastPoints[0].x, 2) + Math.pow(this.lastPoints[1].y - this.lastPoints[0].y, 2) - ); - if (prevDistance > 0 && currentDistance > 0) { - const scaleChange = currentDistance / prevDistance; - const centerX = (currentPoints[0].x + currentPoints[1].x) / 2; - const centerY = (currentPoints[0].y + currentPoints[1].y) / 2; - this.transformMatrix.scale(scaleChange, scaleChange, centerX, centerY); - } + if (touches.length < 2) + return; + const currentDistance = this.calculateDistance(touches); + if (this.lastPinchDistance && currentDistance) { + const scaleChange = currentDistance / this.lastPinchDistance; + const centerX = (touches[0].clientX + touches[1].clientX) / 2; + const centerY = (touches[0].clientY + touches[1].clientY) / 2; + this.transformMatrix.scale(scaleChange, scaleChange, centerX, centerY); } - this.lastPoints = currentPoints; + this.lastPinchDistance = currentDistance; + } + calculateDistance(touches) { + const dx = touches[0].clientX - touches[1].clientX; + const dy = touches[0].clientY - touches[1].clientY; + return Math.sqrt(dx * dx + dy * dy); } } exports.GestureHandler = GestureHandler; diff --git a/unpackage/dist/dev/mp-weixin/pages/index/transform-canvas.js b/unpackage/dist/dev/mp-weixin/pages/index/transform-canvas.js index 6d2d7c3..11a4667 100644 --- a/unpackage/dist/dev/mp-weixin/pages/index/transform-canvas.js +++ b/unpackage/dist/dev/mp-weixin/pages/index/transform-canvas.js @@ -91,9 +91,17 @@ const _sfc_main = { this.initCanvas(); }, methods: { + // 修正坐标转换方法 invertPoint(x, y) { - const inverted = this.matrix.invertPoint(x, y); - return inverted; + const det = this.matrix.a * this.matrix.d - this.matrix.b * this.matrix.c; + return { + x: (this.matrix.d * x - this.matrix.c * y - this.matrix.d * this.matrix.tx + this.matrix.c * this.matrix.ty) / det, + y: (-this.matrix.b * x + this.matrix.a * y + this.matrix.b * this.matrix.tx - this.matrix.a * this.matrix.ty) / det + }; + }, + // 添加移动速度检查 + shouldIgnoreClick() { + return Date.now() - this.lastTouchTime < 300; }, // 添加点击检测方法 checkHitArea(x, y) { @@ -186,7 +194,7 @@ const _sfc_main = { }); this.redraw(); } catch (e) { - common_vendor.index.__f__("error", "at pages/index/transform-canvas.vue:240", "图片加载失败:", e); + common_vendor.index.__f__("error", "at pages/index/transform-canvas.vue:250", "图片加载失败:", e); this.image = null; } },