问题
I am using Rechart library and using AreaChartFillByValue. I am facing following issues
1) When I zoom in the chart goes outside the x-axis and when I zoom out it just reset to where it started for example: suppose the current starting point is 1 to 15 but actual data is 30 and when I zoom in it shows 5 to 10 value in x-axis and when I zoom it takes back to 1 to 15 value. I want it should zoom till the entire data display from 1 to 30.
2) When I zoom in brush should zoom out and show the filter starting and ending point for example: suppose the current starting point is 1 to 15 and when I zoom in it shows 5 to 10 value in x-axis but the brush still shows 1 to 15 value.
3) I am not able to drag the chart when it is zoom in. I am able to drag the brush and update the chart display but not able to do it from the chart.
4) The color split is not working when I use a brush. The positive value display in green and negative value display in red. But it is not taking middle value properly. I followed the official tutorial link using the brush it is giving the same issue.
I tried all the examples which are available on the internet but not able to find a solution for zoom in and brush. It would great if anyone can resolve this issue. As there no similar open issues in GITHUB
To make it more clear please see the below two expected image.
My output
My Code: stackblitz editor
Expected output
Example Link for the above image
Example Link for the above image
来源：https://stackoverflow.com/questions/52770794/react-js-rechart-zoom-in-out-and-brush-issue