Cache event offset coordinates (#7795)

diff --git a/src/core/core.controller.js b/src/core/core.controller.js
index 9ea1dce06b3c9f400bf1f66c207d6fc5dc444767..1bc6c896d20c58fe4e76b18d63f1bb4330da50a3 100644 (file)
--- a/src/core/core.controller.js
+++ b/src/core/core.controller.js
@@ -993,7 +993,9 @@ class Chart {
                        }
                };
 
-               let listener = function(e) {
+               let listener = function(e, x, y) {
+                       e.offsetX = x;
+                       e.offsetY = y;
                        me._eventHandler(e);
                };
 

diff --git a/src/helpers/helpers.dom.js b/src/helpers/helpers.dom.js
index 34052002a4c9093bd9d698bf45e9e6593b029472..6fc70c62782968a3076eb5712b0501a106f60e37 100644 (file)
--- a/src/helpers/helpers.dom.js
+++ b/src/helpers/helpers.dom.js
@@ -93,7 +93,7 @@ export function getRelativePosition(evt, chart) {
        const e = evt.originalEvent || evt;
        const touches = e.touches;
        const source = touches && touches.length ? touches[0] : e;
-       const {offsetX, offsetY, layerX, layerY, target} = source;
+       const {offsetX, offsetY} = source;
 
        if (offsetX > 0 || offsetY > 0) {
                return {
@@ -102,13 +102,6 @@ export function getRelativePosition(evt, chart) {
                };
        }
 
-       if (layerX > 0 || layerY > 0) {
-               return {
-                       x: layerX - target.offsetLeft,
-                       y: layerY - target.offsetTop
-               };
-       }
-
        return calculateRelativePositionFromClientXY(source, chart);
 }
 

diff --git a/src/helpers/helpers.extras.js b/src/helpers/helpers.extras.js
index 0bfec3e091a20de9e3e90d27e23a5af70da3ba17..e821fb967eef4e4e2467dd727d134d905a852dc5 100644 (file)
--- a/src/helpers/helpers.extras.js
+++ b/src/helpers/helpers.extras.js
@@ -19,13 +19,15 @@ export const requestAnimFrame = (function() {
  * Latest argments are used on the actual call
  * @param {function} fn
  * @param {*} thisArg
+ * @param {function} [updateFn]
  */
-export function throttled(fn, thisArg) {
+export function throttled(fn, thisArg, updateFn) {
+       const updateArgs = updateFn || ((args) => Array.prototype.slice.call(args));
        let ticking = false;
        let args = [];
 
        return function(...rest) {
-               args = Array.prototype.slice.call(rest);
+               args = updateArgs(rest);
 
                if (!ticking) {
                        ticking = true;

diff --git a/src/platform/platform.dom.js b/src/platform/platform.dom.js
index 1b2eb28810e56f7341db5f681e6b644ab41e8d45..4a31ebf542233c0f0a006826665b6bbf2a195b78 100644 (file)
--- a/src/platform/platform.dom.js
+++ b/src/platform/platform.dom.js
@@ -245,7 +245,10 @@ function createProxyAndListen(chart, type, listener) {
                if (chart.ctx !== null) {
                        listener(fromNativeEvent(event, chart));
                }
-       }, chart);
+       }, chart, (args) => {
+               const event = args[0];
+               return [event, event.offsetX, event.offsetY];
+       });
 
        addListener(canvas, type, proxy);
 

diff --git a/test/specs/helpers.dom.tests.js b/test/specs/helpers.dom.tests.js
index 454322dbec97182daaf4c64d43fffea24b88beb9..3a2f95724ac5584c4242a4dcf09b49fbcdb9b4e6 100644 (file)
--- a/test/specs/helpers.dom.tests.js
+++ b/test/specs/helpers.dom.tests.js
@@ -263,33 +263,7 @@ describe('DOM helpers tests', function() {
                        expect(helpers.getRelativePosition(event, chart)).toEqual({x: 0, y: 10});
                });
 
-               it('should use layerX/Y - target offsets when available', function() {
-                       const chart = undefined;
-
-                       const event1 = {
-                               layerX: 0,
-                               layerY: 10,
-                               target: {
-                                       offsetLeft: 0,
-                                       offsetTop: 5
-                               }
-                       };
-                       expect(helpers.getRelativePosition(event1, chart)).toEqual({x: 0, y: 5});
-
-                       const event2 = {
-                               offsetX: 0,
-                               offsetY: 0,
-                               layerX: 10,
-                               layerY: 10,
-                               target: {
-                                       offsetLeft: 0,
-                                       offsetTop: 5
-                               }
-                       };
-                       expect(helpers.getRelativePosition(event2, chart)).toEqual({x: 10, y: 5});
-               });
-
-               it('should calculate from clientX/Y if offset/layer coords are not available', function() {
+               it('should calculate from clientX/Y as fallback', function() {
                        const chart = window.acquireChart({}, {
                                canvas: {
                                        height: 200,