diff --git a/frontend/src/views/chart/components/ChartComponent.vue b/frontend/src/views/chart/components/ChartComponent.vue
index ef6702181f..b6d2577ca1 100644
--- a/frontend/src/views/chart/components/ChartComponent.vue
+++ b/frontend/src/views/chart/components/ChartComponent.vue
@@ -47,6 +47,9 @@
       </div>
 
     </div>
+    <div
+      :class="loading ? 'symbol-map-loading' : 'symbol-map-loaded'"
+    />
   </div>
 </template>
 
@@ -167,7 +170,8 @@ export default {
       borderRadius: '0px',
       mapCenter: null,
       linkageActiveParam: null,
-      buttonTextColor: null
+      buttonTextColor: null,
+      loading: true
     }
   },
 
@@ -222,6 +226,7 @@ export default {
       }
     },
     preDraw() {
+      this.loading = true
       // 基于准备好的dom，初始化echarts实例
       // 渲染echart等待dom加载完毕,渲染之前先尝试销毁具有相同id的echart 放置多次切换仪表板有重复id情况
       const that = this
@@ -253,6 +258,10 @@ export default {
             that.$refs.viewTrack.trackButtonClick()
           }
         })
+        this.myChart.off('finished')
+        this.myChart.on('finished', () => {
+          this.loading = false
+        })
       })
     },
     loadThemeStyle() {