fix #4794; jumping tooltp over bars in shadow DOM

apexcharts · Nov 10, 2024 · 78f5dd5 · 78f5dd5
1 parent cfb7ef0
commit 78f5dd5
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 11 deletions.
diff --git 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
@@ -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
@@ -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()