From 162aaa993ae6e3887553db70355da1093e7c8e90 Mon Sep 17 00:00:00 2001 From: Evert Timberg Date: Sun, 20 Sep 2015 17:57:27 -0400 Subject: [PATCH] Convert screen coordinates into canvas coordinates when dealing with mouse events --- src/core/core.helpers.js | 14 ++++++++++---- 1 file changed, 10 insertions(+), 4 deletions(-) diff --git a/src/core/core.helpers.js b/src/core/core.helpers.js index ab58b0789..bd18fd08d 100644 --- a/src/core/core.helpers.js +++ b/src/core/core.helpers.js @@ -642,14 +642,20 @@ boundingRect = canvas.getBoundingClientRect(); if (e.touches) { - mouseX = e.touches[0].clientX - boundingRect.left; - mouseY = e.touches[0].clientY - boundingRect.top; + mouseX = e.touches[0].clientX; + mouseY = e.touches[0].clientY; } else { - mouseX = e.clientX - boundingRect.left; - mouseY = e.clientY - boundingRect.top; + mouseX = e.clientX; + mouseY = e.clientY; } + // Scale mouse coordinates into canvas coordinates + // by following the pattern laid out by 'jerryj' in the comments of + // http://www.html5canvastutorials.com/advanced/html5-canvas-mouse-coordinates/ + mouseX = Math.round((mouseX - boundingRect.left) / (boundingRect.right - boundingRect.left) * canvas.width); + mouseY = Math.round((mouseY - boundingRect.top) / (boundingRect.bottom - boundingRect.top) * canvas.height); + return { x: mouseX, y: mouseY -- 2.47.2