From 1e3cf7a24f70ca540ec2499606f2298c46d0ef16 Mon Sep 17 00:00:00 2001
From: Przemek Wiech <pwiech@gmail.com>
Date: Fri, 4 Feb 2022 19:03:15 +0100
Subject: [PATCH] Fixed incorrect chart positioning after transition

---
 src/chart.tsx | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/chart.tsx b/src/chart.tsx
index 8edd88f..73903fe 100644
--- a/src/chart.tsx
+++ b/src/chart.tsx
@@ -269,6 +269,7 @@ class ChartWrapper {
   private zoomBehavior?: ZoomBehavior<Element, any>;
   /** Props that will be used for rerendering. */
   private rerenderProps?: ChartProps;
+  private rerenderResetPosition?: boolean;
 
   zoom(factor: number) {
     const parent = select('#svgContainer') as Selection<Element, any, any, any>;
@@ -292,6 +293,7 @@ class ChartWrapper {
     if (!args.initialRender && this.animating) {
       this.rerenderRequired = true;
       this.rerenderProps = props;
+      this.rerenderResetPosition = args.resetPosition;
       return;
     }
 
@@ -392,7 +394,7 @@ class ChartWrapper {
         // the props may have been updated in the meantime.
         this.renderChart(this.rerenderProps!, intl, {
           initialRender: false,
-          resetPosition: false,
+          resetPosition: !!this.rerenderResetPosition,
         });
       }
     });
@@ -417,7 +419,10 @@ export function Chart(props: ChartProps) {
       const initialRender =
         props.chartType !== prevProps?.chartType ||
         props.colors !== prevProps?.colors;
-      const resetPosition = props.chartType !== prevProps?.chartType;
+      const resetPosition =
+        props.chartType !== prevProps?.chartType ||
+        props.data !== prevProps.data ||
+        props.selection !== prevProps.selection;
       chartWrapper.current.renderChart(props, intl, {
         initialRender,
         resetPosition,
@@ -428,7 +433,7 @@ export function Chart(props: ChartProps) {
         resetPosition: true,
       });
     }
-  });
+  }, [props.data, props.selection, props.chartType, props.colors]);
 
   return (
     <div id="svgContainer">