Cache event offset coordinates (#7795)

This commit is contained in:
Jukka Kurkela 2020-09-14 18:37:29 +03:00 committed by GitHub
parent 2563ff174e
commit 2f888172d4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 13 additions and 39 deletions

View File

@ -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);
};

View File

@ -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);
}

View File

@ -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;

View File

@ -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);

View File

@ -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,