diff --git a/src/chart/effectScatter/EffectScatterSeries.ts b/src/chart/effectScatter/EffectScatterSeries.ts
index f0340fb9ac96600b3d8b08dd1176260905c02fe1..e6f88303c6de34d3f41eb1942dd0ab8ac76faa04 100644
--- a/src/chart/effectScatter/EffectScatterSeries.ts
+++ b/src/chart/effectScatter/EffectScatterSeries.ts
@@ -71,6 +71,7 @@ export interface EffectScatterSeriesOption extends SeriesOption<EffectScatterSta
      * When to show the effect
      */
     showEffectOn?: 'render' | 'emphasis'
+    clip?: boolean
 
     /**
      * Ripple effect config
@@ -107,6 +108,7 @@ class EffectScatterSeriesModel extends SeriesModel<EffectScatterSeriesOption> {
 
         // When to show the effect, option: 'render'|'emphasis'
         showEffectOn: 'render',
+        clip: true,
 
         // Ripple effect config
         rippleEffect: {
diff --git a/src/chart/effectScatter/EffectScatterView.ts b/src/chart/effectScatter/EffectScatterView.ts
index 722073140f517a5dc9856c0eb1ca30631e15c7ea..ac56824a17f3861f7e3923ce2e2ee8fced1a5dbe 100644
--- a/src/chart/effectScatter/EffectScatterView.ts
+++ b/src/chart/effectScatter/EffectScatterView.ts
@@ -41,10 +41,16 @@ class EffectScatterView extends ChartView {
     render(seriesModel: EffectScatterSeriesModel, ecModel: GlobalModel, api: ExtensionAPI) {
         const data = seriesModel.getData();
         const effectSymbolDraw = this._symbolDraw;
-        effectSymbolDraw.updateData(data);
+        effectSymbolDraw.updateData(data, {clipShape: this._getClipShape(seriesModel)});
         this.group.add(effectSymbolDraw.group);
     }
 
+    _getClipShape(seriesModel: EffectScatterSeriesModel) {
+        const coordSys = seriesModel.coordinateSystem;
+        const clipArea = coordSys && coordSys.getArea && coordSys.getArea();
+        return seriesModel.get('clip', true) ? clipArea : null;
+    }
+
     updateTransform(seriesModel: EffectScatterSeriesModel, ecModel: GlobalModel, api: ExtensionAPI) {
         const data = seriesModel.getData();