diff --git a/src/components/Selector.vue b/src/components/Selector.vue
index 9f31e270..e733397b 100644
--- a/src/components/Selector.vue
+++ b/src/components/Selector.vue
@@ -28,7 +28,6 @@ limitations under the License. -->
       :key="item.value"
       :label="item.label"
       :value="item.value"
-      :disabled="!!item.disabled"
     >
     </el-option>
   </el-select>
diff --git a/src/graphql/fragments/topology.ts b/src/graphql/fragments/topology.ts
index d9fd901e..c84cce9e 100644
--- a/src/graphql/fragments/topology.ts
+++ b/src/graphql/fragments/topology.ts
@@ -117,49 +117,3 @@ export const InstanceTopology = {
   }
 `,
 };
-
-export const TopoServiceMetric = {
-  variable: "$idsS: [ID!]!",
-  query: `
-  cpmS: getValues(metric: {
-    name: "service_relation_server_cpm"
-    ids: $idsS
-  }, duration: $duration) {
-    values {
-      id
-      value
-    }
-  }
-  latencyS: getValues(metric: {
-    name: "service_relation_server_resp_time"
-    ids: $idsS
-  }, duration: $duration) {
-    values {
-      id
-      value
-    }
-  }`,
-};
-
-export const TopoClientMetric = {
-  variable: "$idsC: [ID!]!",
-  query: `
-  cpmC: getValues(metric: {
-    name: "service_relation_client_cpm"
-    ids: $idsC
-  }, duration: $duration) {
-    values {
-      id
-      value
-    }
-  }
-  latencyC: getValues(metric: {
-    name: "service_relation_client_resp_time"
-    ids: $idsC
-  }, duration: $duration) {
-    values {
-      id
-      value
-    }
-  }`,
-};
diff --git a/src/locales/lang/en.ts b/src/locales/lang/en.ts
index 704133ef..7a96f187 100644
--- a/src/locales/lang/en.ts
+++ b/src/locales/lang/en.ts
@@ -76,7 +76,8 @@ const msg = {
   editGraph: "Edit Graph Options",
   dashboardName: "Select Dashboard Name",
   linkDashboard: "Dashboard name related with topology calls",
-  linkMetrics: "Metrics related with topology calls",
+  linkServerMetrics: "Server metrics related with topology calls",
+  linkClientMetrics: "Client metrics related with topology calls",
   nodeDashboard: "Dashboard name related with topology nodes",
   nodeMetrics: "Metrics related with topology nodes",
   instanceDashboard: "Dashboard name related with service instances",
diff --git a/src/locales/lang/zh.ts b/src/locales/lang/zh.ts
index 00170ac2..52fcd8fd 100644
--- a/src/locales/lang/zh.ts
+++ b/src/locales/lang/zh.ts
@@ -75,7 +75,8 @@ const msg = {
   editGraph: "编辑图表选项",
   dashboardName: "选择仪表板名称",
   linkDashboard: "拓扑线关联的仪表板名称",
-  linkMetrics: "拓扑线关联的指标",
+  linkServerMetrics: "拓扑线服务端关联的指标",
+  linkClientMetrics: "拓扑线客户端关联的指标",
   nodeDashboard: "拓节点关联的仪表板名称",
   nodeMetrics: "拓扑节点关联的指标",
   instanceDashboard: "拓节点关联的实例的仪表板名称",
diff --git a/src/views/dashboard/related/topology/Graph.vue b/src/views/dashboard/related/topology/Graph.vue
index d4c24203..6245310a 100644
--- a/src/views/dashboard/related/topology/Graph.vue
+++ b/src/views/dashboard/related/topology/Graph.vue
@@ -19,7 +19,7 @@ limitations under the License. -->
     v-loading="loading"
     :style="`height: ${height}`"
   >
-    <div class="setting" v-if="showSetting">
+    <div class="setting" v-show="showSetting">
       <Settings @update="updateSettings" />
     </div>
     <Icon
@@ -340,12 +340,6 @@ function updateSettings(config: any) {
 onBeforeUnmount(() => {
   window.removeEventListener("resize", resize);
 });
-// watch(
-//   () => [topologyStore.calls, topologyStore.nodes],
-//   () => {
-//     update();
-//   }
-// );
 </script>
 <style lang="scss">
 .micro-topo-chart {
@@ -359,7 +353,7 @@ onBeforeUnmount(() => {
     height: 700px;
     background-color: #2b3037;
     overflow: auto;
-    padding: 0 10px;
+    padding: 0 15px;
     border-radius: 3px;
     color: #ccc;
     transition: all 0.5ms linear;
diff --git a/src/views/dashboard/related/topology/Settings.vue b/src/views/dashboard/related/topology/Settings.vue
index 76bdd27b..bdadec3f 100644
--- a/src/views/dashboard/related/topology/Settings.vue
+++ b/src/views/dashboard/related/topology/Settings.vue
@@ -23,7 +23,7 @@ limitations under the License. -->
       size="small"
       class="inputs"
     />
-    <div class="label">{{ t("linkMetrics") }}</div>
+    <div class="label">{{ t("linkServerMetrics") }}</div>
     <Selector
       class="inputs"
       :multiple="true"
@@ -33,7 +33,7 @@ limitations under the License. -->
       placeholder="Select metrics"
       @change="changeLinkServerMetrics"
     />
-    <div class="label">{{ t("linkMetrics") }}</div>
+    <div class="label">{{ t("linkClientMetrics") }}</div>
     <Selector
       class="inputs"
       :multiple="true"