Merge pull request #3725 from VisActor/fix/tooltip-enterable-effect

Fix/tooltip enterable effect
VisActor · Feb 13, 2025 · 357d8c8 · 357d8c8
2 parents 05db465 + 2c055cd
commit 357d8c8
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 2 deletions.
diff --git a/common/changes/@visactor/vchart/fix-tooltip-enterable-effect_2025-02-12-04-11.json b/common/changes/@visactor/vchart/fix-tooltip-enterable-effect_2025-02-12-04-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "fix: tooltip should not handle mousemove or mouseout when enter tooltip, fix #3708\n\n",
+      "type": "none",
+      "packageName": "@visactor/vchart"
+    }
+  ],
+  "packageName": "@visactor/vchart",
+  "email": "[email protected]"
+}
diff --git a/packages/vchart/src/component/tooltip/tooltip.ts b/packages/vchart/src/component/tooltip/tooltip.ts
@@ -55,6 +55,10 @@ export class Tooltip extends BaseComponent<any> implements ITooltip {
   private _needInitEventOfTooltip?: boolean;
   private _enterable: boolean;
   private _isReleased: boolean = false;
+  /**
+   * 是否正在浏览tooltip内容
+   */
+  private _isEnterTooltip: boolean;
   protected declare _spec: ITooltipSpec;
 
   tooltipHandler?: ITooltipHandler;
@@ -178,6 +182,7 @@ export class Tooltip extends BaseComponent<any> implements ITooltip {
         if (!this._enterable) {
           return;
         }
+        this._isEnterTooltip = true;
 
         const rect = element.getBoundingClientRect?.();
         if (rect) {
@@ -198,6 +203,7 @@ export class Tooltip extends BaseComponent<any> implements ITooltip {
         if (!this._enterable) {
           return;
         }
+        this._isEnterTooltip = false;
 
         if (this._cacheEnterableRect) {
           const newRect = element.getBoundingClientRect?.();
@@ -348,7 +354,7 @@ export class Tooltip extends BaseComponent<any> implements ITooltip {
   };
 
   protected _handleChartMouseOut = (params?: BaseEventParams) => {
-    if (this._alwaysShow || this._isReleased) {
+    if (this._alwaysShow || this._isReleased || this._isEnterTooltip) {
       return;
     }
 
@@ -370,7 +376,7 @@ export class Tooltip extends BaseComponent<any> implements ITooltip {
   };
 
   protected _getMouseMoveHandler = (isClick: boolean) => (params: BaseEventParams) => {
-    if (this._isReleased) {
+    if (this._isReleased || this._isEnterTooltip) {
       return;
     }
     if (this._outTimer) {