-
Notifications
You must be signed in to change notification settings - Fork 11.9k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[BUG] onHover not triggered for doughnut chart #4296
Comments
@ricardocosta89 thanks for providing a test case. I quickly looked into this and the cause is that https://github.com/chartjs/Chart.js/blob/master/src/core/core.controller.js#L812-L815 should use I'm happy to look at a PR fixing this. The docs already list that |
Before we fix this we should make sure that it's the code that's wrong and not the docs. We should look at v2.0.0 and see where the |
I went back to v2.0.0 and it's always been options: {
hover: {
onHover: function() {
}
}
} So that means we need to update the docs. |
Oh bummer. I just submitted the PR fixing the code. 😅 |
No worries, just change it to update the docs instead 😄 |
Taking into account that the
It won't introduce breaking changes, but it will keep consistency regarding the |
@ricardocosta89 just proposed that on the PR 😄 Just waiting to see what @simonbrunel thinks but I like that idea since it's cleaner. I would go ahead and make the code change! |
I'll wait for feedback, then. Also, one thing I just noticed is that the callback is invoked for every mouse movement, so we have a lot of calls despite the segment only being hovered once from the user perspective. Is there a way to prevent this? |
I believe there is an open issue for that. It really depends on what |
In my case I just wanted to increase the outerRadius, so it will be the second approach (hover selection change). I'll try to see if there's anything stating that the hover is on/off to use in my callback. Edit: It seems the event doesn't drill down inside the canvas element. Unless there's a way to identify if a given set of mouse coordinates belongs to the item surface, it's going to be harder to do this. 😞 |
We've already written the intersection code. When |
Yes, I managed to do it tinkering around with Chart.js code. I'll try to do it on my side without exposing the |
I agree, for consistency I prefer having |
@simonbrunel Another question I have: is |
I don't think it's deprecated, the |
I expected that, but when trying out with hover for the doughnut chart, it was always entering the |
I think it's always entering the |
Fix onHover event not being triggered The core controller was looking at the wrong object (options.hover) to find the function to be called on hover. The function is provided on the top level options object (options.onHover). By using the helper function, there's no need to verify if the callback is defined, as the helper already does that. Fixes #4296
Ah, indeed. I have to call |
Yup, I think that's a new issue |
This fix will let the hover event fire again. `globalOptions.onHover` is not working - `globalOptions.hover.onHover` seems to work fine. See chartjs/Chart.js#4296
Fix onHover event not being triggered The core controller was looking at the wrong object (options.hover) to find the function to be called on hover. The function is provided on the top level options object (options.onHover). By using the helper function, there's no need to verify if the callback is defined, as the helper already does that. Fixes chartjs#4296
The function provided on the
onHover
option is not being triggered for a doughnut chart. I don't know if this is also affecting other types of chart.The issue was already reported in #3799, but was closed because nobody presented a test case.
Expected Behavior
The provided function should be called when the mouse hovers a segment of the chart.
Current Behavior
Nothing happens on hover, but the onClick event is working.
Steps to Reproduce (for bugs)
When hovering over on a segment, the tooltip shows but the onHover function is not called.
When clicking a segment, the onClick function is called.
Codepen: https://codepen.io/anon/pen/ZKNGEQ
Context
I was trying to expand (increase outerRadius) a slice of the chart when hovering. If necessary, I can provide a gist with the expansion working for the onClick event.
Environment
The text was updated successfully, but these errors were encountered: