Skip to content
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

Line Chart : crash when hovering an empty chart that is interactive #2597

Closed
akassaei opened this issue May 28, 2024 · 7 comments
Closed

Line Chart : crash when hovering an empty chart that is interactive #2597

akassaei opened this issue May 28, 2024 · 7 comments

Comments

@akassaei
Copy link
Contributor

Describe/explain the bug
When hovering a Line Chart with empty data, the chart crashes.

To Reproduce
Here is the link to a Codesandbox showing the issue : https://codesandbox.io/p/sandbox/charming-mendel-3wsx4v?file=%2Fsrc%2Fcomponents%2FLineChart.js%3A110%2C25

Steps to reproduce the behavior:

  1. Create a Line Chart with empty Data
  2. Hover the Chart with your mouse
  3. See the crash

Expected behavior
No crash 😅

Additional context
I spotted where the issue is coming from : basically the findNode method in Mesh hooks relies on d3-delaunay and specifically on delaunay.find method. With no data points given, the .find returns NaN and it isn't a case checked in the code so we try to access the node related to the index and it crashes because it's undefined.

const findNode = useCallback(
(event: MouseEvent<ElementType> | TouchEvent<ElementType>): null | [number, Node] => {
if (!elementRef.current) return null
const [x, y] = getRelativeCursor(elementRef.current, event)
let index: number | null = delaunay.find(x, y)
let node = index !== undefined ? nodes[index] : null

I've already opened an issue on d3-delaunay side because I don't think NaN is really an expected behavior 😅 You can find the issue opened here : d3/d3-delaunay#144

On our side, I've patched Nivo to return null when nodes.length === 0. So I have a fix ready if you want me to handle it, but I'm not sure that's how you want to handle it 😄

@gercog1
Copy link

gercog1 commented Jul 27, 2024

hey @akassaei!

Did you find a quick workaround for this one?

I am also struggling ;)

@robiscoding
Copy link

Any update here?

@akassaei
Copy link
Contributor Author

akassaei commented Nov 12, 2024

@gercog1 @robiscoding Sorry didn't see your messages
On my side I've directly patched the Nivo package using patch-package, as said in the original description I've just changed the code to return null when nodes.length === 0

@plouc is that something you can look at please ?
I can definitely open a PR for this with same change I've done in my patch

@plouc
Copy link
Owner

plouc commented Nov 13, 2024

@akassaei, a PR would be nice :)

@akassaei
Copy link
Contributor Author

Hey @plouc 👋
A PR was made just here: #2669
Whenever you have time it would be awesome to have a review please 🙏

@plouc
Copy link
Owner

plouc commented Nov 15, 2024

Fixed by #2669

@plouc plouc closed this as completed Nov 15, 2024
@diego9497
Copy link

Is this already part of any release?, I'm still having the issue

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants