visx
visx copied to clipboard
airbnb
Snap tooltip in XYChart for stacked datasets
Why can't tooltips snap with stacked areas or bars?
Please see example: https://airbnb.io/visx/xychart and toggle between bar/area stack and any other bar/area/line variant and note the stacked variants don't snap the tooltip.
Hi @jelle-blaauw 👋 thanks for checking out visx. Currently this is an implementation limitation. Stacked series have to derive new data from the data passed to the stack children (i.e., the position of a stack layer depends on all of the other data points that compose the full stack). It's been a bit since I looked at the implementation but iirc the TooltipContext holds the original data passed to the stack children, and the chart scales expect the derived data ... so if you tried snapping to data points, you'd get the unstacked positions.
So we'd likely need to introduce a concept of derived data in the TooltipContext for this to work. Or alternatively we could add the scaled coordinates of a given datum to the context.
@williaster I can pick this up, if not already. I think using scaled coordinates of a given datum would be a better way here.
Hi, everyone! I'm also trying to snap tooltip with a stacked dataset. My approach to fix it was more minimalistic (see #1668 ). Since the Tooltip currently works with data as passed by the user and the derived stack data are only used internally (AFAIK), it seems to make sense that the Tooltip will work with data in the original format and doesn't need to know anything about whether and how the data was transformed.
After a brief look, it looks like the concept of derived data would introduce a lot of complexity inside visx (mostly a topic for regular maintainers?) and potentially for the user as well (unless TooltipContext would only use the derived data internally...which would mean the data has to go through some back-and-forth transformations if I'm not wrong).
Just my two cents.
Just a side note: If it's decided to go with the derived data in TooltipContext, I don't feel confident in visx codebase enough to handle this on my own :-)
Any update on this issue?
Hi, @jelle-blaauw . A little workaround: You can call TooltipContext's updateTooltip with the desired 'snapped' values for tooltipTop and/or tooltipLeft whenever the tooltip's position is updated.
Be careful about handling all the updates well, though. Also, this kind of duplicates visx's internal snapping logic