From 9f0cdce001b13854d741a28998eb97aa1bcf9475 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BB=A5=E6=98=95?= <huanian.chn@alibaba-inc.com>
Date: Mon, 6 Dec 2021 18:48:33 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20plot=20=E6=9B=B4=E6=96=B0=E4=BC=98?=
 =?UTF-8?q?=E5=8C=96=EF=BC=8C=E5=87=8F=E5=B0=91=E9=9D=9E=E5=BF=85=E8=A6=81?=
 =?UTF-8?q?=E6=9B=B4=E6=96=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                           |  2 +-
 src/core.ts                            |  2 +-
 src/createPlot.tsx                     | 20 ++++++------
 src/utils/isEqual.ts                   | 42 ++++++++++++++++++++++++++
 unittest/plots/_update-option-spec.tsx |  4 +++
 5 files changed, 59 insertions(+), 11 deletions(-)
 create mode 100644 src/utils/isEqual.ts

diff --git a/package.json b/package.json
index 8fa3bede..1000876d 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "bizcharts",
-  "version": "4.1.15-beta.1",
+  "version": "4.1.15",
   "description": "bizcharts",
   "keywords": [
     "bizcharts",
diff --git a/src/core.ts b/src/core.ts
index 34424abf..3c2c58e8 100644
--- a/src/core.ts
+++ b/src/core.ts
@@ -17,7 +17,7 @@ registerEngine('svg', SVGEngine);
 
 // @ts-ignore
 export * from '@antv/g2/lib/core';
-export const VERSION = '4.1.15-beta.1';
+export const VERSION = '4.1.15';
 
 
 
diff --git a/src/createPlot.tsx b/src/createPlot.tsx
index 66620150..6466fe14 100644
--- a/src/createPlot.tsx
+++ b/src/createPlot.tsx
@@ -20,7 +20,8 @@ import {
   polyfillTitleEvent,
   polyfillDescriptionEvent,
 } from './plots/core/polyfill';
-import { debounce, isArray, isFunction, isNil, isEqual } from '@antv/util';
+import { debounce, isArray, isFunction, isNil } from '@antv/util';
+import isEqual from './utils/isEqual';
 import warn from 'warning';
 
 // 国际化处理
@@ -100,13 +101,13 @@ class BasePlot extends React.Component<any> {
     }
     polyfillEvents(this.g2Instance, {}, this.props);
     this.g2Instance.data = this.props.data;
-    this.preConfig = pickWithout(this.props, [
+    this.preConfig = cloneDeep(pickWithout(this.props, [
       ...REACT_PIVATE_PROPS,
       'container',
       'PlotClass',
       'onGetG2Instance',
       'data',
-    ]);
+    ]));
   }
   componentDidUpdate(prevProps) {
     if (this.props.children && this.g2Instance.chart) {
@@ -149,11 +150,12 @@ class BasePlot extends React.Component<any> {
       this.g2Instance.destroy();
       this.initInstance();
       this.g2Instance.render();
-    } else if (this.diffConfig()) {
-      // 对比options是否更新
-      if (!isEqual(currentConfig, this.preConfig)) {
-        this.g2Instance.update(currentConfig);
-      }
+    } else if (this.diffConfig() ) {
+      // options更新
+      this.g2Instance.update({
+        ...currentConfig,
+        data: this.props.data
+      });
     } else if (this.diffData()) {
       this.g2Instance.changeData(this.props.data);
     }
@@ -180,7 +182,7 @@ class BasePlot extends React.Component<any> {
       'onGetG2Instance',
       'data',
     ]);
-    return !shallowEqual(preConfig, currentConfig);
+    return !isEqual(preConfig, currentConfig);
   }
   diffData() {
     // 只有数据更新就不重绘，其他全部直接重新创建实例。
diff --git a/src/utils/isEqual.ts b/src/utils/isEqual.ts
new file mode 100644
index 00000000..bbed1ff2
--- /dev/null
+++ b/src/utils/isEqual.ts
@@ -0,0 +1,42 @@
+
+import { isObject, isArray } from '@antv/util';
+
+const isEqual = (value: any, other: any): boolean => {
+  if (isObject(value) && isObject(other)) {
+    const valueKeys = Object.keys(value);
+    const otherKeys = Object.keys(other);
+    if (valueKeys.length !== otherKeys.length) {
+      return false;
+    }
+    let rst = true;
+    for (let i = 0; i < valueKeys.length; i++) {
+      rst = isEqual(value[valueKeys[i]], other[valueKeys[i]]);
+      if (!rst) {
+        break;
+      }
+    }
+    return rst;
+  }
+  if (isArray(value) && isArray(other)) {
+    if (value.length !== other.length) {
+      return false;
+    }
+    let rst = true;
+    for (let i = 0; i < value.length; i++) {
+      rst = isEqual(value[i], other[i]);
+      if (!rst) {
+        break;
+      }
+    }
+    return rst;
+  }
+  if (value === other) {
+    return true;
+  }
+  if (!value || !other) {
+    return false;
+  }
+  return false;
+};
+
+export default isEqual;
diff --git a/unittest/plots/_update-option-spec.tsx b/unittest/plots/_update-option-spec.tsx
index 26993006..5de3364f 100644
--- a/unittest/plots/_update-option-spec.tsx
+++ b/unittest/plots/_update-option-spec.tsx
@@ -31,6 +31,10 @@ const Demo = () => {
       setState({...opt, seriesField: undefined });
       console.log('change')
     }}>click me change option seriesField</div>
+    <div onClick={() => {
+      setState({...opt, data: [] });
+      console.log('change')
+    }}>click me change option seriesField</div>
 
     <BarChart
       {...option}