From 4aa4497ec4b6d66a99d7887d7e2e6d9c784b3c0b Mon Sep 17 00:00:00 2001 From: Evert Timberg Date: Tue, 13 Apr 2021 19:01:56 -0400 Subject: [PATCH 1/2] Do not redraw endlessly on mouse move The tooltip incorrectly determined that the position changed leading to many redraws --- src/plugins/plugin.tooltip.js | 14 +++++++++----- types/index.esm.d.ts | 2 +- 2 files changed, 10 insertions(+), 6 deletions(-) diff --git a/src/plugins/plugin.tooltip.js b/src/plugins/plugin.tooltip.js index d77c387372a..3b06299b6f1 100644 --- a/src/plugins/plugin.tooltip.js +++ b/src/plugins/plugin.tooltip.js @@ -1,7 +1,7 @@ import Animations from '../core/core.animations'; import Element from '../core/core.element'; import {addRoundedRectPath} from '../helpers/helpers.canvas'; -import {each, noop, isNullOrUndef, isArray, _elementsEqual} from '../helpers/helpers.core'; +import {each, noop, isNullOrUndef, isArray, _elementsEqual, valueOrDefault} from '../helpers/helpers.core'; import {toFont, toPadding, toTRBLCorners} from '../helpers/helpers.options'; import {getRtlAdapter, overrideTextDirection, restoreTextDirection} from '../helpers/helpers.rtl'; import {distanceBetweenPoints, _limitValue} from '../helpers/helpers.math'; @@ -16,7 +16,7 @@ const positioners = { * Average mode places the tooltip at the average position of the elements shown * @function Chart.Tooltip.positioners.average * @param items {object[]} the items being displayed in the tooltip - * @returns {object} tooltip position + * @returns {object} tooltip position. false if no position */ average(items) { if (!items.length) { @@ -52,6 +52,10 @@ const positioners = { * @returns {object} the tooltip position */ nearest(items, eventPosition) { + if (!items.length) { + return false; + } + let x = eventPosition.x; let y = eventPosition.y; let minDistance = Number.POSITIVE_INFINITY; @@ -1073,9 +1077,9 @@ export class Tooltip extends Element { * @returns {boolean} True if the position has changed */ _positionChanged(active, e) { - const me = this; - const position = positioners[me.options.position].call(me, active, e); - return me.caretX !== position.x || me.caretY !== position.y; + const {caretX, caretY, options} = this; + const position = positioners[options.position].call(this, active, e); + return caretX !== valueOrDefault(position.x, caretX) || caretY !== valueOrDefault(position.y, caretY); } } diff --git a/types/index.esm.d.ts b/types/index.esm.d.ts index 6d6fa09bf79..b1e347215d4 100644 --- a/types/index.esm.d.ts +++ b/types/index.esm.d.ts @@ -2331,7 +2331,7 @@ export interface TooltipModel { export const Tooltip: Plugin & { readonly positioners: { - [key: string]: (items: readonly Element[], eventPosition: { x: number; y: number }) => { x: number; y: number }; + [key: string]: (items: readonly Element[], eventPosition: { x: number; y: number }) => { x: number; y: number } | false; }; getActiveElements(): ActiveElement[]; From 9af66f5054c474143735531d4ba3dbed9996fa02 Mon Sep 17 00:00:00 2001 From: Evert Timberg Date: Thu, 15 Apr 2021 16:25:25 -0400 Subject: [PATCH 2/2] Code review feedback --- src/plugins/plugin.tooltip.js | 11 ++--------- 1 file changed, 2 insertions(+), 9 deletions(-) diff --git a/src/plugins/plugin.tooltip.js b/src/plugins/plugin.tooltip.js index 3b06299b6f1..b852e7ee47a 100644 --- a/src/plugins/plugin.tooltip.js +++ b/src/plugins/plugin.tooltip.js @@ -1,7 +1,7 @@ import Animations from '../core/core.animations'; import Element from '../core/core.element'; import {addRoundedRectPath} from '../helpers/helpers.canvas'; -import {each, noop, isNullOrUndef, isArray, _elementsEqual, valueOrDefault} from '../helpers/helpers.core'; +import {each, noop, isNullOrUndef, isArray, _elementsEqual} from '../helpers/helpers.core'; import {toFont, toPadding, toTRBLCorners} from '../helpers/helpers.options'; import {getRtlAdapter, overrideTextDirection, restoreTextDirection} from '../helpers/helpers.rtl'; import {distanceBetweenPoints, _limitValue} from '../helpers/helpers.math'; @@ -14,9 +14,6 @@ import {drawPoint} from '../helpers'; const positioners = { /** * Average mode places the tooltip at the average position of the elements shown - * @function Chart.Tooltip.positioners.average - * @param items {object[]} the items being displayed in the tooltip - * @returns {object} tooltip position. false if no position */ average(items) { if (!items.length) { @@ -46,10 +43,6 @@ const positioners = { /** * Gets the tooltip position nearest of the item nearest to the event position - * @function Chart.Tooltip.positioners.nearest - * @param items {object[]} the tooltip items - * @param eventPosition {object} the position of the event in canvas coordinates - * @returns {object} the tooltip position */ nearest(items, eventPosition) { if (!items.length) { @@ -1079,7 +1072,7 @@ export class Tooltip extends Element { _positionChanged(active, e) { const {caretX, caretY, options} = this; const position = positioners[options.position].call(this, active, e); - return caretX !== valueOrDefault(position.x, caretX) || caretY !== valueOrDefault(position.y, caretY); + return position !== false && (caretX !== position.x || caretY !== position.y); } }