diff --git a/frontend/package.json b/frontend/package.json
index 878dfb942d..9b086470af 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -26,7 +26,15 @@
   },
   "dependencies": {
     "@antv/g2plot": "^2.4.9",
-    "@antv/l7-maps": "^2.8.35",
+    "@antv/l7": "2.8.31",
+    "@antv/l7-component": "2.8.31",
+    "@antv/l7-core": "2.8.31",
+    "@antv/l7-layers": "2.8.31",
+    "@antv/l7-maps": "2.8.31",
+    "@antv/l7-renderer": "2.8.31",
+    "@antv/l7-scene": "2.8.31",
+    "@antv/l7-source": "2.8.31",
+    "@antv/l7-utils": "2.8.31",
     "@antv/s2": "^1.11.0",
     "@antv/util": "^2.0.17",
     "@riophae/vue-treeselect": "0.4.0",
diff --git a/frontend/src/components/canvas/custom-component/UserView.vue b/frontend/src/components/canvas/custom-component/UserView.vue
index a232b4d887..b7140f6448 100644
--- a/frontend/src/components/canvas/custom-component/UserView.vue
+++ b/frontend/src/components/canvas/custom-component/UserView.vue
@@ -553,12 +553,22 @@ export default {
         sourceCustomAttr[param.property][param.value.modifyName] = param.value[param.value.modifyName]
         this.sourceCustomAttrStr = JSON.stringify(sourceCustomAttr)
         this.chart.customAttr = this.sourceCustomAttrStr
+        this.$store.commit('updateComponentViewsData', {
+          viewId: this.chart.id,
+          propertyKey: 'customAttr',
+          propertyValue: this.sourceCustomAttrStr
+        })
         updateParams['customAttr'] = this.sourceCustomAttrStr
       } else if (param.custom === 'customStyle') {
         const sourceCustomStyle = JSON.parse(this.sourceCustomStyleStr)
         sourceCustomStyle[param.property][param.value.modifyName] = param.value[param.value.modifyName]
         this.sourceCustomStyleStr = JSON.stringify(sourceCustomStyle)
         this.chart.customStyle = this.sourceCustomStyleStr
+        this.$store.commit('updateComponentViewsData', {
+          viewId: this.chart.id,
+          propertyKey: 'customStyle',
+          propertyValue: this.sourceCustomStyleStr
+        })
         updateParams['customStyle'] = this.sourceCustomStyleStr
       }
       viewPropsSave(this.panelInfo.id, updateParams).then(rsp => {
diff --git a/frontend/src/store/index.js b/frontend/src/store/index.js
index 06cea3b8ad..12e2388627 100644
--- a/frontend/src/store/index.js
+++ b/frontend/src/store/index.js
@@ -608,10 +608,22 @@ const data = {
         if (element === id) {
           delete state.batchOptViews[id]
           state.curBatchOptComponents.splice(index, 1)
-          this.commit('setBatchOptChartInfo')
           break
         }
       }
+      if (state.curBatchOptComponents.length === 1) {
+        const lastViewId = state.curBatchOptComponents[0]
+        const viewBaseInfo = state.componentViewsData[lastViewId]
+        state.changeProperties.customAttr = JSON.parse(viewBaseInfo.customAttr)
+        state.changeProperties.customStyle = JSON.parse(viewBaseInfo.customStyle)
+      }
+      if (state.curBatchOptComponents.length === 0) {
+        state.changeProperties = {
+          customStyle: {},
+          customAttr: {}
+        }
+      }
+      this.commit('setBatchOptChartInfo')
     },
     addCurBatchComponent(state, id) {
       if (id) {
@@ -621,11 +633,18 @@ const data = {
         // get properties
         const viewConfig = state.allViewRender.filter(item => item.render === viewBaseInfo.render && item.value === viewBaseInfo.type)
         if (viewConfig && viewConfig.length > 0) {
+          if (state.curBatchOptComponents.length === 1) {
+            state.changeProperties.customAttr = JSON.parse(viewBaseInfo.customAttr)
+            state.changeProperties.customStyle = JSON.parse(viewBaseInfo.customStyle)
+          }
           state.batchOptViews[id] = viewConfig[0]
           this.commit('setBatchOptChartInfo')
         }
       }
     },
+    updateComponentViewsData(state, { viewId, propertyKey, propertyValue }) {
+      state.componentViewsData[viewId][propertyKey] = propertyValue
+    },
     removeCurMultiplexingComponentWithId(state, id) {
       delete state.curMultiplexingComponents[id]
     },
diff --git a/frontend/src/views/chart/components/shape-attr/LabelSelectorAntV.vue b/frontend/src/views/chart/components/shape-attr/LabelSelectorAntV.vue
index f98dea4544..4772ddac22 100644
--- a/frontend/src/views/chart/components/shape-attr/LabelSelectorAntV.vue
+++ b/frontend/src/views/chart/components/shape-attr/LabelSelectorAntV.vue
@@ -155,7 +155,7 @@
         >
           <el-checkbox
             v-model="labelForm.show"
-            @change="changeLabelAttr"
+            @change="changeLabelAttr('show')"
           >{{ $t('chart.show') }}</el-checkbox>
         </el-form-item>
         <div v-show="labelForm.show">
@@ -167,7 +167,7 @@
               v-model="labelForm.fontSize"
               :placeholder="$t('chart.text_fontsize')"
               size="mini"
-              @change="changeLabelAttr"
+              @change="changeLabelAttr('fontSize')"
             >
               <el-option
                 v-for="option in fontSize"
@@ -185,7 +185,7 @@
               v-model="labelForm.color"
               class="color-picker-style"
               :predefine="predefineColors"
-              @change="changeLabelAttr"
+              @change="changeLabelAttr('color')"
             />
           </el-form-item>
           <el-form-item
@@ -194,7 +194,7 @@
           >
             <el-select
               v-model="labelForm.gaugeLabelFormatter.type"
-              @change="changeLabelAttr"
+              @change="changeLabelAttr('gaugeLabelFormatter')"
             >
               <el-option
                 v-for="type in typeList"
@@ -215,7 +215,7 @@
               :min="0"
               :max="10"
               size="mini"
-              @change="changeLabelAttr"
+              @change="changeLabelAttr('gaugeLabelFormatter')"
             />
           </el-form-item>
           <el-form-item
@@ -227,7 +227,7 @@
               v-model="labelForm.gaugeLabelFormatter.unit"
               :placeholder="$t('chart.pls_select_field')"
               size="mini"
-              @change="changeLabelAttr"
+              @change="changeLabelAttr('gaugeLabelFormatter')"
             >
               <el-option
                 v-for="item in unitList"
@@ -246,7 +246,7 @@
               size="mini"
               clearable
               :placeholder="$t('commons.input_content')"
-              @change="changeLabelAttr"
+              @change="changeLabelAttr('gaugeLabelFormatter')"
             />
           </el-form-item>
           <el-form-item
@@ -255,7 +255,7 @@
           >
             <el-checkbox
               v-model="labelForm.gaugeLabelFormatter.thousandSeparator"
-              @change="changeLabelAttr"
+              @change="changeLabelAttr('gaugeLabelFormatter')"
             />
           </el-form-item>
         </div>