esnet / esnet/react-timeseries-charts
YAxis does not rerender when passed a new min/max
- Dominant language
- JavaScript
- Stars
- 876
- Forks
- 279
- PR merge metrics
- No merged PRs in 30d
Description
### **What?**
Currently the YAxis component does not rerender when new min/max props are provided. This is unfortunate for developers who would prefer variable axes.
### **Why?**
The YAxis component always returns false in the `shouldComponentUpdate` react lifecycle method. According to @pjm17971 this is "because d3 is controlling the DOM below this component, the component doesn't re-render in the same way because that would take control from d3. Instead [react-timeseries-charts] uses the props change to force d3 to re-create / alter the DOM that it controls." This means that elsewhere in the project, there should be a check for a change in min/max and that is not happening.
### **When?**
Any time after initial load when the component is passed new min/max props. May happen with other props as well, but I have not experimented with any others.
### **How?**
1. Create a new chart with a YAxis who's min and max props are set by parent props.
2. Do something that causes one or more of those props to change.
3. New props are passed to YAxis.
4. Axes do not update.
This is even more obvious when the axis prop you are passing to `LineChart` is the same prop that you are passing to `YAxis`. The `LineChart` will rerender (points/line are plotted), and will properly scale to the updated axis prop, but since the axes don't also update, the scale of the plotted lines is immediately inaccurate.
### **Solution**
The issue will be solved when:
- Wherever the chart is handling updated props, it also checks if min or max have been updated and rerenders/recreates the chart axes.
Contributor guide
Assessment
This issue has not been assessed yet.