diff --git a/src/styles/theme.scss b/src/styles/theme.scss
index e17ab4bb..51319fc2 100644
--- a/src/styles/theme.scss
+++ b/src/styles/theme.scss
@@ -15,9 +15,19 @@
  * limitations under the License.
  */
 @use "element-plus/theme-chalk/src/dark/css-vars.scss" as *;
+@keyframes topo-dash {
+  from {
+    stroke-dashoffset: 10;
+  }
+
+  to {
+    stroke-dashoffset: 0;
+  }
+}
 :root {
   --sw-green: #70c877;
   --sw-orange: #e6a23c;
+  --sw-topo-animation: topo-dash 0.3s linear infinite;
 }
 
 html {
diff --git a/src/views/dashboard/related/topology/components/Graph.vue b/src/views/dashboard/related/topology/components/Graph.vue
index 44933c0e..d7a34112 100644
--- a/src/views/dashboard/related/topology/components/Graph.vue
+++ b/src/views/dashboard/related/topology/components/Graph.vue
@@ -815,7 +815,7 @@ limitations under the License. -->
       stroke-width: 1px;
       stroke-dasharray: 10 10;
       fill: none;
-      animation: topo-dash 0.3s linear infinite;
+      animation: var(--sw-topo-animation);
     }
 
     .topo-line-anchor,
@@ -823,15 +823,6 @@ limitations under the License. -->
       cursor: pointer;
     }
   }
-  @keyframes topo-dash {
-    from {
-      stroke-dashoffset: 10;
-    }
-
-    to {
-      stroke-dashoffset: 0;
-    }
-  }
 
   .el-loading-spinner {
     top: 30%;
diff --git a/src/views/dashboard/related/topology/components/Map.vue b/src/views/dashboard/related/topology/components/Map.vue
index d9f44b81..0396dfe2 100644
--- a/src/views/dashboard/related/topology/components/Map.vue
+++ b/src/views/dashboard/related/topology/components/Map.vue
@@ -134,7 +134,7 @@ limitations under the License. -->
   const popover = ref<Nullable<any>>(null);
   const graphWidth = ref<number>(100);
   const currentNode = ref<Nullable<Node>>();
-  const diff = computed(() => [(width.value - graphWidth.value - 100) / 2, 0]);
+  const diff = computed(() => [(width.value - graphWidth.value) / 2, 0]);
   const radius = 8;
 
   onMounted(async () => {
@@ -576,7 +576,7 @@ limitations under the License. -->
       stroke-width: 1px;
       stroke-dasharray: 10 10;
       fill: none;
-      animation: topo-dash 0.3s linear infinite;
+      animation: var(--sw-topo-animation);
     }
 
     .topo-line-anchor,
@@ -584,15 +584,6 @@ limitations under the License. -->
       cursor: pointer;
     }
   }
-  @keyframes topo-dash {
-    from {
-      stroke-dashoffset: 10;
-    }
-
-    to {
-      stroke-dashoffset: 0;
-    }
-  }
 
   .el-loading-spinner {
     top: 30%;