diff --git a/nezha-fronted/src/components/common/nezhaColor.vue b/nezha-fronted/src/components/common/nezhaColor.vue
index 721c5ff02..515435a62 100644
--- a/nezha-fronted/src/components/common/nezhaColor.vue
+++ b/nezha-fronted/src/components/common/nezhaColor.vue
@@ -116,6 +116,16 @@ export default {
         this.$emit('colorChange', color.hex, this.keyName)
       }
     },
+    update () {
+      if (!this.isTopo) {
+        this.keyName = this.valueArr[0].name
+        this.colors = this.valueArr[0].value || randomcolor() + 'FF'
+        this.$emit('colorChange', this.colors, this.keyName)
+      } else {
+        this.keyName = this.valueArr[0].name
+        this.colors = this.valueArr[0].value
+      }
+    },
     changeColor () {
       this.showColorPicker = !this.showColorPicker
       if (this.showColorPicker) {
diff --git a/nezha-fronted/src/components/common/project/meta2d/js/meta2dMain.js b/nezha-fronted/src/components/common/project/meta2d/js/meta2dMain.js
index a83c77295..f292694e9 100644
--- a/nezha-fronted/src/components/common/project/meta2d/js/meta2dMain.js
+++ b/nezha-fronted/src/components/common/project/meta2d/js/meta2dMain.js
@@ -178,7 +178,7 @@ export default {
         }
       }
       pen.disableInput = pen.disableInput || true
-      pen.lineAnimateType = pen.lineAnimateType || 0
+      pen.lineAnimateType = pen.lineAnimateType || undefined
       pen.animateSpan = pen.animateSpan || 1
       pen.animateReverse = pen.animateReverse || false
       pen.fromArrow = pen.fromArrow || ''
@@ -223,6 +223,15 @@ export default {
         if (!pen.data.tooltip.legends.length) {
           return
         }
+        let positionShow = false
+        pen.data.tooltip.legends.forEach(item=>{
+          if (item.legend) {
+            positionShow = true
+          }
+        })
+        if (!positionShow) {
+          return;
+        }
         this.chartParams = {
           ...pen.data.tooltip,
           unit: this.params.unit,
@@ -286,7 +295,14 @@ export default {
       if (key === 'lineName') {
         getTopology(this.meta2dId).updateLineType(pen, pen[key])
       }
-      getTopology(this.meta2dId).setValue(obj)
+      if (key === 'lineAnimateType') {
+        if (!pen[key]) {
+          obj.autoPlay = false
+        } else {
+          obj.autoPlay = true
+        }
+      }
+      getTopology(this.meta2dId).setValue(obj) // 更新pen
       if (key === 'lineAnimateType') {
         if (!pen[key]) {
           getTopology(this.meta2dId).stopAnimate(pen.id)
diff --git a/nezha-fronted/src/components/common/project/meta2d/js/topoUtil.js b/nezha-fronted/src/components/common/project/meta2d/js/topoUtil.js
index 3d306b25b..de3d72764 100644
--- a/nezha-fronted/src/components/common/project/meta2d/js/topoUtil.js
+++ b/nezha-fronted/src/components/common/project/meta2d/js/topoUtil.js
@@ -10,6 +10,7 @@ export default {
     },
     initEdit (id) {
       bus.$emit('changeSelectPens', [])
+      getTopology(id).active([])
       getTopology(id).lock(0)
       getTopology(id).stopAnimate()
       if (getTopology(id).data().pens) {
@@ -205,6 +206,7 @@ export default {
         pen.animateColor = mapping.color.bac
         pen.borderColor = mapping.color.border
         pen.color = mapping.color.text
+        console.log(!!pen.lineAnimateType)
         if (pen.lineAnimateType) {
           pen.autoPlay = true
         }
diff --git a/nezha-fronted/src/components/common/project/meta2d/meta2dData.vue b/nezha-fronted/src/components/common/project/meta2d/meta2dData.vue
index 905bfa6c4..54906127c 100644
--- a/nezha-fronted/src/components/common/project/meta2d/meta2dData.vue
+++ b/nezha-fronted/src/components/common/project/meta2d/meta2dData.vue
@@ -282,12 +282,6 @@ export default {
           text: this.$t('dashboard.panel.lastSevenDay'),
           type: 'date',
           value: 7 * 24 * 60
-        },
-        {
-          id: 11,
-          text: this.$t('dashboard.panel.lastThirtyDay'),
-          type: 'date',
-          value: 30 * 24 * 60
         }
       ]
     }
diff --git a/nezha-fronted/src/components/common/project/meta2d/meta2dElement.vue b/nezha-fronted/src/components/common/project/meta2d/meta2dElement.vue
index 74c49b4de..4d2c2df17 100644
--- a/nezha-fronted/src/components/common/project/meta2d/meta2dElement.vue
+++ b/nezha-fronted/src/components/common/project/meta2d/meta2dElement.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="pens-data right-box__container">
+  <div class="pens-data right-box__container" :key="pen.id">
     <div v-if="pen.id">
 <!--      <el-input-number v-model="pen.x" @change="change('x')"/>-->
 <!--      node-->
@@ -186,6 +186,7 @@
               </div>
               <div class="form-row-value">
                 <nezhaColor
+                  :ref="'nezhaColorPenColor'"
                   :isTopo="true"
                   :value-arr="[{name:'color',value: pen.color}]"
                   @colorChange="colorChange"/>
@@ -225,6 +226,7 @@
               </div>
               <div class="form-row-value">
                 <nezhaColor
+                  :ref="'nezhaColorPenBackground'"
                   :isTopo="true"
                   :value-arr="[{name:'background',value: pen.background}]"
                   @colorChange="colorChange"/>
@@ -287,6 +289,7 @@
               </div>
               <div class="form-row-value">
                 <nezhaColor
+                  :ref="'nezhaColorPenTextColor'"
                   :isTopo="true"
                   :value-arr="[{name:'textColor',value: pen.textColor}]"
                   @colorChange="colorChange"/>
@@ -569,6 +572,7 @@
               </div>
               <div class="form-row-value">
                 <nezhaColor
+                  :ref="'nezhaColorPenColor'"
                   :isTopo="true"
                   :value-arr="[{name:'color',value: pen.color}]"
                   @colorChange="colorChange"/>
@@ -600,6 +604,7 @@
               </div>
               <div class="form-row-value">
                 <nezhaColor
+                  :ref="'nezhaColorPenBorderColor'"
                   :isTopo="true"
                   :value-arr="[{name:'borderColor',value: pen.borderColor}]"
                   @colorChange="colorChange"/>
@@ -655,14 +660,14 @@
             </div>
             <div class="form-row-item">
               <div class="form-row-key">
-                {{$t('project.topology.speed')}} (0 - 10)
+                {{$t('project.topology.speed')}} (1 - 10)
               </div>
               <div class="form-row-value">
                 <el-input-number
                   @focus="inputFocus"
                   @blur="inputBlur"
                   :step="1"
-                  :min="0"
+                  :min="1"
                   :max="10"
                   :precision="0"
                   controls-position="right"
@@ -680,6 +685,7 @@
               </div>
               <div class="form-row-value">
                 <nezhaColor
+                  :ref="'nezhaColorPenAnimateColor'"
                   :isTopo="true"
                   :value-arr="[{name:'animateColor',value: pen.animateColor}]"
                   @colorChange="colorChange"/>
@@ -1023,6 +1029,7 @@ export default {
       immediate: true,
       handler (n) {
         this.pen = n[0]
+        this.nzColorUpdate()
         // todo 判断legend 是否还存在
         // this.$forceUpdate()
       }
@@ -1038,6 +1045,7 @@ export default {
     return {
       theme: theme,
       pen: {},
+      refsArr: ['nezhaColorPenColor', 'nezhaColorPenBackground', 'nezhaColorPenTextColor', 'nezhaColorPenBorderColor', 'nezhaColorPenAnimateColor'],
       chartType: [
         { id: 'line', name: 'Line' },
         { id: 'area', name: 'Area' },
@@ -1169,6 +1177,9 @@ export default {
           this.pen.text = this.pen.data.textValue
         }
       }
+      if (key === 'lineAnimateType') {
+        this.pen.autoPlay = false
+      }
       this.$emit('change', key)
     },
     updateImage (image) {
@@ -1264,6 +1275,13 @@ export default {
         legend: '',
         alias: ''
       })
+    },
+    nzColorUpdate () {
+      this.refsArr.forEach(item => {
+        if (this.$refs[item]) {
+          this.$refs[item].update()
+        }
+      })
     }
 
   }