From 194dde17478837cb4ddaa098752c47a32522731e Mon Sep 17 00:00:00 2001 From: Jukka Kurkela Date: Sat, 3 Apr 2021 10:36:45 +0300 Subject: [PATCH] Limit onHover to chartArea --- docs/configuration/interactions.md | 4 ++-- src/core/core.controller.js | 8 ++++---- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/docs/configuration/interactions.md b/docs/configuration/interactions.md index 38ddb0fd516..8ab239ab2ef 100644 --- a/docs/configuration/interactions.md +++ b/docs/configuration/interactions.md @@ -18,8 +18,8 @@ Namespace: `options` | Name | Type | Default | Description | ---- | ---- | ------- | ----------- | `events` | `string[]` | `['mousemove', 'mouseout', 'click', 'touchstart', 'touchmove']` | The `events` option defines the browser events that the chart should listen to for tooltips and hovering. [more...](#event-option) -| `onHover` | `function` | `null` | Called when any of the events fire. Passed the event, an array of active elements (bars, points, etc), and the chart. -| `onClick` | `function` | `null` | Called if the event is of type `'mouseup'` or `'click'`. Passed the event, an array of active elements, and the chart. +| `onHover` | `function` | `null` | Called when any of the events fire over chartArea. Passed the event, an array of active elements (bars, points, etc), and the chart. +| `onClick` | `function` | `null` | Called if the event is of type `'mouseup'`, `'click'` or '`'contextmenu'` over chartArea. Passed the event, an array of active elements, and the chart. ### Event Option diff --git a/src/core/core.controller.js b/src/core/core.controller.js index 6e6bfec13e1..7b7a2a2d6f5 100644 --- a/src/core/core.controller.js +++ b/src/core/core.controller.js @@ -1106,11 +1106,11 @@ class Chart { // This prevents recursion if the handler calls chart.update() me._lastEvent = null; - // Invoke onHover hook - callCallback(options.onHover, [e, active, me], me); + if (_isPointInArea(e, me.chartArea, me._minPadding)) { + // Invoke onHover hook + callCallback(options.onHover, [e, active, me], me); - if (e.type === 'mouseup' || e.type === 'click' || e.type === 'contextmenu') { - if (_isPointInArea(e, me.chartArea, me._minPadding)) { + if (e.type === 'mouseup' || e.type === 'click' || e.type === 'contextmenu') { callCallback(options.onClick, [e, active, me], me); } }