-
Notifications
You must be signed in to change notification settings - Fork 719
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
[xychart] Tooltip does not update when chart position changes #983
Comments
Same issue here. I solved it by passing a key to the XY chart that changes based on the props. |
Ah this is an interesting limitation. The It's implemented with |
This proved to be very difficult to handle, because even relying on changing props, it was difficult to get the In my case, I couldn't work a solution. I just disable the tooltips when in an "edit mode" where charts can be moved, then re-enable them after that mode is exited and transitions are finished. Just leaving this here in for posterity. |
It also behaves like with reflows of the UI overall it seems. As on the first load of my page, I think I have for a 0.1ms a loading spinner, then it actually renders everything, and tooltips are around 300px off vertically (exactly the size of the elements that rendered above them) if I go to other route and return back in, so it renders without loading spinner (because of cache) everything aligns ok. Plus if I scroll. As a workaround, I added this :)
And it seems it fixes tooltips right after timeout triggers :) |
Oof, yeah this sounds bad. Let me play around with an approach so lib consumers don't have to deal with this. Thanks for all the info 👍 |
Was exploring if Another option would be to let users opt out of using the Portal-based tooltips. |
My hack above works perfectly. Unsure it's bad perf wise, but I don't see why it would be :) Probably for the use-case of issue creator, just calling this effect on after each drag and drop will do the trick. As a side note, @williaster why you folks never enabled Github Discussions? It's a really nice place to ask questions while still non bloating issues with them. Highly recommend :) Love libs that have that section enabled. |
@RIP21 great suggestion re discussions, it wasn't available for a while but looks like it is now. Just enabled it, so discuss away! 😎 |
We use the |
Screen.Recording.2020-12-29.at.2.42.58.pm.mov
This behaviour happens when using visx in the
react-grid-layout
library. When the chart is moved, the x and y positions are not updated and the tooltip is displayed where the chart used to be. After a resize, the since the width prop has changed, the tooltip is rendered correctly.I can work around this by passing the chart's X and Y position in as a prop, but I feel like this may be something that the library can solve automatically for me. Thoughts?
The text was updated successfully, but these errors were encountered: