From 78f5dd510624f932dcc8f2a3cebeda75222a9f7d Mon Sep 17 00:00:00 2001 From: Juned Chhipa Date: Sun, 10 Nov 2024 19:38:34 +0530 Subject: [PATCH] fix #4794; jumping tooltp over bars in shadow DOM --- src/modules/Filters.js | 7 ++++--- src/modules/tooltip/Intersect.js | 8 ++++---- src/modules/tooltip/Tooltip.js | 6 ++---- 3 files changed, 10 insertions(+), 11 deletions(-) diff --git a/src/modules/Filters.js b/src/modules/Filters.js index 3c09feede..2718f7bab 100644 --- a/src/modules/Filters.js +++ b/src/modules/Filters.js @@ -57,11 +57,11 @@ class Filters { }) if (!shadowAttr.noUserSpaceOnUse) { - el.filterer().node.setAttribute('filterUnits', 'userSpaceOnUse') + el.filterer()?.node?.setAttribute('filterUnits', 'userSpaceOnUse') } // this scales the filter to a bigger size so that the dropshadow doesn't crops - this._scaleFilterSize(el.filterer().node) + this._scaleFilterSize(el.filterer()?.node) } // appends dropShadow to the filter object which can be chained with other filter effects @@ -131,7 +131,7 @@ class Filters { } // this scales the filter to a bigger size so that the dropshadow doesn't crops - this._scaleFilterSize(el.filterer().node) + this._scaleFilterSize(el.filterer()?.node) return el } @@ -152,6 +152,7 @@ class Filters { } _scaleFilterSize(el) { + if (!el) return const setAttributes = (attrs) => { for (let key in attrs) { if (attrs.hasOwnProperty(key)) { diff --git a/src/modules/tooltip/Intersect.js b/src/modules/tooltip/Intersect.js index 5c4425042..dfeaf6bb0 100644 --- a/src/modules/tooltip/Intersect.js +++ b/src/modules/tooltip/Intersect.js @@ -159,6 +159,10 @@ class Intersect { e, opt, }) + if (barXY.j === null && barXY.barHeight === 0 && barXY.barWidth === 0) { + return // bar was not hovered and didn't receive correct coords + } + i = barXY.i let j = barXY.j @@ -192,10 +196,6 @@ class Intersect { 10 ) - const isReversed = w.globals.isMultipleYAxis - ? w.config.yaxis[seriesIndex] && w.config.yaxis[seriesIndex].reversed - : w.config.yaxis[0].reversed - if (x + ttCtx.tooltipRect.ttWidth > w.globals.gridWidth) { x = x - ttCtx.tooltipRect.ttWidth } else if (x < 0) { diff --git a/src/modules/tooltip/Tooltip.js b/src/modules/tooltip/Tooltip.js index 4988edd8d..e65762efa 100644 --- a/src/modules/tooltip/Tooltip.js +++ b/src/modules/tooltip/Tooltip.js @@ -354,7 +354,7 @@ export default class Tooltip { onSeriesHover(opt, e) { // If a user is moving their mouse quickly, don't bother updating the tooltip every single frame - const targetDelay = 100 + const targetDelay = 20 const timeSinceLastUpdate = Date.now() - this.lastHoverTime if (timeSinceLastUpdate >= targetDelay) { // The tooltip was last updated over 100ms ago - redraw it even if the user is still moving their @@ -876,9 +876,7 @@ export default class Tooltip { if (this.barSeriesHeight > 0) { // hover state, activate snap filter let graphics = new Graphics(this.ctx) - let paths = w.globals.dom.Paper.find( - `.apexcharts-bar-area[j='${j}']` - ) + let paths = w.globals.dom.Paper.find(`.apexcharts-bar-area[j='${j}']`) // de-activate first this.deactivateHoverFilter()