LabelList not visible while Bar is animating
- [x] I have searched the issues of this repository and believe that this is not a duplicate.
Previous issue was closed without a proper resolution https://github.com/recharts/recharts/issues/829
Reproduction link
Steps to reproduce
Click the "update data" button and notice the "Page A" label is not displayed until the bar finishes animating.
What is expected?
Labels are visible while bar animation is loading
What is actually happening?
Labels disappear while bar animation is loading
| Environment | Info |
|---|---|
| Recharts | v2.1.5 |
| React | 17.0.2 |
| System | Mac OS 12.6 |
| Browser | Chrome 106.0.5249.119 |
Hi @remjx
Thanks for the report. If you can see when the data initially loads the LabelList is not present there either until the initial animation finishes. Recharts has to calculate internally the position of the LabelList items and it cannot do that until the chart finishes its animation.
How do you expect the animation to go? Especially that recharts doesn't know what data is on the chart vs what will be set in the chart next. If we had a large dataset we'd have to compare the diff in order to determine which elements to remove and which to animate.
I'm going to label this as an enhancement, but I think it might be unrealistic due to the nature of recharts and the nature of changing datasets/animation
Recharts has to calculate internally the position of the LabelList items and it cannot do that until the chart finishes its animation.
This does not make sense. I expect the animation not to start until the calculations are complete, in other words the animation needs to know the start and end points. Until the LabelList calculations are complete, I think the animations should not start.
Makes sense, disregard that point. We're discussing a roadmap for 3.0 and improving animation is one of those topics - I wouldn't expect a fix or addition for this any time soon though unless you'd like to contribute. Thanks!