-
-
Notifications
You must be signed in to change notification settings - Fork 1.7k
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
Area Chart + Brush: Descending data is reversed on brush #4514
Comments
I think I got it working by reversing the |
This is still odd and shouldn't be the case. I'm pretty sure this doesn't happen with other charts.. I'll check out out at some point. |
@cerahmed looks like your sandbox isn't accessible. Could you make it public? |
Appologies about that, first time using sandbox. Please check if it's working now. |
Yeah I can, thanks! |
So adding a sort to your data "fixes" it
I thought it was because the Brush chart didn't have a corresponding XAxis, but it doesn't seem thats the problem. This warrants further investigation. I'll reopen it |
It is indeed; however after a second thought, it makes sense. For example, both arrays Hence, when the left handle of the brush moves one unit to the right, the |
ah you're right. Internally recharts doesn't do any sorting for numerical axes because d3 does the work with numeric scales to interpolate where they would be on the axis. But Brush is an internal implementation based solely on indices, and those two ideas don't work well together. So it makes sense, but I wouldn't say its ideal. Brush is unreliable for numeric data that isn't pre-sorted. |
Fair enough :D I'll be back with ideas on how to fix the issue if I get any. |
Do you want to request a feature or report a bug?
Report a bug/missing feature.
What is the current behavior?
I have an Area Chart to display
datetime
on the x-axis, andpercentage
on the y-axis.The data is loaded progressivly by descending order. That is,
items[0] = newest
anditems[length-1] = oldest
. This way, the user sees the newest data as the remaining data is loaded.However, the brush is reversed. Dragging the left handle of the brush cuts the right side of the area chart, and vice versa.
I tried reversing the
startIndex
andendIndex
of Brush, but that made the Area Chart disappear (due to the start index is now larger than the end index?)If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo.
Codesandbox demo
What is the expected behavior?
The Brush follows the Area Chart order. Meaning, left handle cuts from the left, and right from the right.
Preferably, a
reversed
property on theBrush
component that bisects the data array in a reversed order.Which versions of Recharts, and which browser / OS are affected by this issue? Did this work in previous versions of Recharts?
react: 18.2.0
recharts: 2.12.4
The text was updated successfully, but these errors were encountered: