fix: filter only one click after drag/pan is completed

chartjs · Nov 18, 2024 · ff0a9ab · ff0a9ab
1 parent 08844c2
commit ff0a9ab
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 4 deletions.
diff --git a/src/hammer.js b/src/hammer.js
@@ -107,14 +107,14 @@ function startPan(chart, state, event) {
 
   state.panScales = getEnabledScalesByPoint(state.options.pan, point, chart);
   state.delta = {x: 0, y: 0};
-  clearTimeout(state.panEndTimeout);
   handlePan(chart, state, event);
 }
 
 function endPan(chart, state) {
   state.delta = null;
   if (state.panning) {
-    state.panEndTimeout = setTimeout(() => (state.panning = false), 500);
+    state.panning = false;
+    state.filterNextClick = true;
     call(state.options.pan.onPanComplete, [{chart}]);
   }
 }

diff --git a/src/handlers.js b/src/handlers.js
@@ -180,7 +180,8 @@ export function mouseUp(chart, event) {
 
   zoomRect(chart, {x: rect.left, y: rect.top}, {x: rect.right, y: rect.bottom}, 'zoom');
 
-  setTimeout(() => (state.dragging = false), 500);
+  state.dragging = false;
+  state.filterNextClick = true;
   call(onZoomComplete, [{chart}]);
 }
 

diff --git a/src/plugin.js b/src/plugin.js
@@ -87,11 +87,19 @@ export default {
     chart.isZoomingOrPanning = () => isZoomingOrPanning(chart);
   },
 
-  beforeEvent(chart) {
+  beforeEvent(chart, {event}) {
     if (isZoomingOrPanning(chart)) {
       // cancel any event handling while panning or dragging
       return false;
     }
+    // cancel the next click or mouseup after drag or pan
+    if (event.type === 'click' || event.type === 'mouseup') {
+      const state = getState(chart);
+      if (state.filterNextClick) {
+        state.filterNextClick = false;
+        return false;
+      }
+    }
   },
 
   beforeUpdate: function(chart, args, options) {