diff --git a/src/views/dashboard/related/topology/components/Graph.vue b/src/views/dashboard/related/topology/components/Graph.vue
index b66217e4..46e87fe9 100644
--- a/src/views/dashboard/related/topology/components/Graph.vue
+++ b/src/views/dashboard/related/topology/components/Graph.vue
@@ -113,7 +113,7 @@ limitations under the License. -->
   const topologyLayout = ref<any>({});
   const graphWidth = ref<number>(100);
   const currentNode = ref<Nullable<Node>>(null);
-  const diff = computed(() => [(width.value - graphWidth.value - 120) / 2, 20]);
+  const diff = computed(() => [(width.value - graphWidth.value - 120) / 2, 40]);
   const radius = 10;
 
   async function init() {
@@ -186,8 +186,7 @@ limitations under the License. -->
   );
 </script>
 <style lang="scss" scoped>
-  .hierarchy-services-topo,
-  hierarchy-services {
+  .hierarchy-services-topo {
     .node-text {
       fill: var(--sw-topology-color);
       font-size: 12px;
@@ -219,10 +218,6 @@ limitations under the License. -->
     }
   }
 
-  .el-loading-spinner {
-    top: 30%;
-  }
-
   .hierarchy-services {
     align-items: center;
     display: flex;
diff --git a/src/views/dashboard/related/topology/pod/InstanceMap.vue b/src/views/dashboard/related/topology/pod/InstanceMap.vue
index 1fddfec8..f92ab280 100644
--- a/src/views/dashboard/related/topology/pod/InstanceMap.vue
+++ b/src/views/dashboard/related/topology/pod/InstanceMap.vue
@@ -171,85 +171,6 @@ limitations under the License. -->
 <style lang="scss" scoped>
   .hierarchy-services-topo {
     position: relative;
-
-    .relation-btn {
-      position: absolute;
-      cursor: pointer;
-      top: 50px;
-      left: 700px;
-      font-size: 12px;
-      color: var(--sw-topology-color);
-    }
-
-    .node-text {
-      fill: var(--sw-topology-color);
-      font-size: 12px;
-      opacity: 0.9;
-    }
-
-    .hierarchy-services-svg {
-      cursor: move;
-      background-color: var(--el-bg-color);
-    }
-
-    .legend {
-      position: absolute;
-      top: 0;
-      left: 0;
-      color: var(--sw-topology-color);
-      font-size: 12px;
-
-      div {
-        margin-bottom: 8px;
-      }
-
-      img {
-        width: 32px;
-        float: left;
-      }
-
-      span {
-        display: inline-block;
-        height: 32px;
-        line-height: 32px;
-        margin-left: 5px;
-      }
-    }
-
-    .hierarchy-settings {
-      position: absolute;
-      top: 40px;
-      right: 10px;
-      width: 280px;
-      height: 420px;
-      overflow: auto;
-      padding: 0 15px;
-      border-radius: 3px;
-      color: $disabled-color;
-      border: 1px solid $border-color-primary;
-      background-color: var(--sw-topology-setting-bg);
-      box-shadow: var(--sw-topology-box-shadow);
-      transition: all 0.5ms linear;
-    }
-
-    .label {
-      color: var(--sw-topology-color);
-      display: inline-block;
-      margin-right: 5px;
-    }
-
-    .topo-line {
-      stroke-linecap: round;
-      stroke-width: 1px;
-      stroke-dasharray: 10 10;
-      fill: none;
-      animation: var(--sw-topo-animation);
-    }
-
-    .topo-line-anchor,
-    .topo-node {
-      cursor: pointer;
-    }
   }
 
   .el-loading-spinner {
diff --git a/src/views/dashboard/related/topology/service/HierarchyMap.vue b/src/views/dashboard/related/topology/service/HierarchyMap.vue
index 8589cd39..5ac59021 100644
--- a/src/views/dashboard/related/topology/service/HierarchyMap.vue
+++ b/src/views/dashboard/related/topology/service/HierarchyMap.vue
@@ -179,85 +179,6 @@ limitations under the License. -->
 <style lang="scss" scoped>
   .hierarchy-services-topo {
     position: relative;
-
-    .relation-btn {
-      position: absolute;
-      cursor: pointer;
-      top: 50px;
-      left: 700px;
-      font-size: 12px;
-      color: var(--sw-topology-color);
-    }
-
-    .node-text {
-      fill: var(--sw-topology-color);
-      font-size: 12px;
-      opacity: 0.9;
-    }
-
-    .hierarchy-services-svg {
-      cursor: move;
-      background-color: var(--el-bg-color);
-    }
-
-    .legend {
-      position: absolute;
-      top: 0;
-      left: 0;
-      color: var(--sw-topology-color);
-      font-size: 12px;
-
-      div {
-        margin-bottom: 8px;
-      }
-
-      img {
-        width: 32px;
-        float: left;
-      }
-
-      span {
-        display: inline-block;
-        height: 32px;
-        line-height: 32px;
-        margin-left: 5px;
-      }
-    }
-
-    .hierarchy-settings {
-      position: absolute;
-      top: 40px;
-      right: 10px;
-      width: 280px;
-      height: 420px;
-      overflow: auto;
-      padding: 0 15px;
-      border-radius: 3px;
-      color: $disabled-color;
-      border: 1px solid $border-color-primary;
-      background-color: var(--sw-topology-setting-bg);
-      box-shadow: var(--sw-topology-box-shadow);
-      transition: all 0.5ms linear;
-    }
-
-    .label {
-      color: var(--sw-topology-color);
-      display: inline-block;
-      margin-right: 5px;
-    }
-
-    .topo-line {
-      stroke-linecap: round;
-      stroke-width: 1px;
-      stroke-dasharray: 10 10;
-      fill: none;
-      animation: var(--sw-topo-animation);
-    }
-
-    .topo-line-anchor,
-    .topo-node {
-      cursor: pointer;
-    }
   }
 
   .el-loading-spinner {