diff --git a/src/components/Charts/Pie/index.js b/src/components/Charts/Pie/index.js
index c6370ea3d0dcd13ada30e72913e70e4a230f4e31..ae3201f22d9a2ee103df8848a9f3c9588324b4e0 100644
--- a/src/components/Charts/Pie/index.js
+++ b/src/components/Charts/Pie/index.js
@@ -6,7 +6,6 @@ import classNames from 'classnames';
 import ReactFitText from 'react-fittext';
 import Debounce from 'lodash-decorators/debounce';
 import Bind from 'lodash-decorators/bind';
-import ResizeObserver from 'resize-observer-polyfill';
 import styles from './index.less';
 
 /* eslint react/no-danger:0 */
@@ -17,17 +16,6 @@ class Pie extends Component {
     legendBlock: false,
   };
 
-  componentDidMount() {
-    window.addEventListener(
-      'resize',
-      () => {
-        this.requestRef = requestAnimationFrame(() => this.resize());
-      },
-      { passive: true }
-    );
-    this.resizeObserver();
-  }
-
   componentDidUpdate(preProps) {
     const { data } = this.props;
     if (data !== preProps.data) {
@@ -37,20 +25,10 @@ class Pie extends Component {
     }
   }
 
-  componentWillUnmount() {
-    window.cancelAnimationFrame(this.requestRef);
-    window.removeEventListener('resize', this.resize);
-    this.resize.cancel();
-    if (this.chartDom) {
-      this.resizeObserverInstance.unobserve(this.chartDom);
-    }
-  }
-
   getG2Instance = chart => {
     this.chart = chart;
     requestAnimationFrame(() => {
       this.getLegendData();
-      this.resize();
     });
   };
 
@@ -96,23 +74,6 @@ class Pie extends Component {
     });
   };
 
-  resizeObserver() {
-    this.resizeObserverInstance = new ResizeObserver(entries => {
-      const { height } = entries[0].contentRect;
-      this.setState(preState => {
-        if (preState.height !== height) {
-          return {
-            height,
-          };
-        }
-        return null;
-      });
-    });
-    if (this.chartDom) {
-      this.resizeObserverInstance.observe(this.chartDom);
-    }
-  }
-
   // for window resize auto responsive legend
   @Bind()
   @Debounce(300)
@@ -226,45 +187,39 @@ class Pie extends Component {
 
     return (
       <div ref={this.handleRoot} className={pieClassName} style={style}>
-        <div
-          ref={ref => {
-            this.chartDom = ref;
-          }}
-        >
-          <ReactFitText maxFontSize={25}>
-            <div className={styles.chart}>
-              <Chart
-                scale={scale}
-                height={height || stateHeight}
-                data={dv}
-                padding={padding}
-                animate={animate}
-                onGetG2Instance={this.getG2Instance}
-              >
-                {!!tooltip && <Tooltip showTitle={false} />}
-                <Coord type="theta" innerRadius={inner} />
-                <Geom
-                  style={{ lineWidth, stroke: '#fff' }}
-                  tooltip={tooltip && tooltipFormat}
-                  type="intervalStack"
-                  position="percent"
-                  color={['x', percent || percent === 0 ? formatColor : defaultColors]}
-                  selected={selected}
-                />
-              </Chart>
-
-              {(subTitle || total) && (
-                <div className={styles.total}>
-                  {subTitle && <h4 className="pie-sub-title">{subTitle}</h4>}
-                  {/* eslint-disable-next-line */}
-                  {total && (
-                    <div className="pie-stat">{typeof total === 'function' ? total() : total}</div>
-                  )}
-                </div>
-              )}
-            </div>
-          </ReactFitText>
-        </div>
+        <ReactFitText maxFontSize={25}>
+          <div className={styles.chart}>
+            <Chart
+              scale={scale}
+              height={height || stateHeight}
+              data={dv}
+              padding={padding}
+              animate={animate}
+              onGetG2Instance={this.getG2Instance}
+            >
+              {!!tooltip && <Tooltip showTitle={false} />}
+              <Coord type="theta" innerRadius={inner} />
+              <Geom
+                style={{ lineWidth, stroke: '#fff' }}
+                tooltip={tooltip && tooltipFormat}
+                type="intervalStack"
+                position="percent"
+                color={['x', percent || percent === 0 ? formatColor : defaultColors]}
+                selected={selected}
+              />
+            </Chart>
+
+            {(subTitle || total) && (
+              <div className={styles.total}>
+                {subTitle && <h4 className="pie-sub-title">{subTitle}</h4>}
+                {/* eslint-disable-next-line */}
+                {total && (
+                  <div className="pie-stat">{typeof total === 'function' ? total() : total}</div>
+                )}
+              </div>
+            )}
+          </div>
+        </ReactFitText>
         {hasLegend && (
           <ul className={styles.legend}>
             {legendData.map((item, i) => (