diff --git a/src/views/dashboard/related/trace/components/D3Graph/Index.vue b/src/views/dashboard/related/trace/components/D3Graph/Index.vue
index 78d71e09..ae261070 100644
--- a/src/views/dashboard/related/trace/components/D3Graph/Index.vue
+++ b/src/views/dashboard/related/trace/components/D3Graph/Index.vue
@@ -69,6 +69,7 @@ limitations under the License. -->
     type: { type: String, default: TraceGraphType.LIST },
     headerType: { type: String, default: "" },
   });
+  const emits = defineEmits(["select"]);
   const appStore = useAppStoreWithOut();
   const loading = ref<boolean>(false);
   const showDetail = ref<boolean>(false);
@@ -130,6 +131,7 @@ limitations under the License. -->
     refParentSpans.value = [];
     if (props.type === TraceGraphType.TABLE) {
       currentSpan.value = i;
+      emits("select", i);
     } else {
       currentSpan.value = i.data;
     }
diff --git a/src/views/dashboard/related/trace/components/Table.vue b/src/views/dashboard/related/trace/components/Table.vue
index 8ec36c47..171f0e5c 100644
--- a/src/views/dashboard/related/trace/components/Table.vue
+++ b/src/views/dashboard/related/trace/components/Table.vue
@@ -12,7 +12,13 @@ See the License for the specific language governing permissions and
 limitations under the License. -->
 <template>
   <div class="trace-table-charts">
-    <Graph :data="data" :traceId="traceId" :type="TraceGraphType.TABLE" :headerType="headerType" />
+    <Graph
+      :data="data"
+      :traceId="traceId"
+      :type="TraceGraphType.TABLE"
+      :headerType="headerType"
+      @select="getSelectedSpan"
+    />
   </div>
 </template>
 <script lang="ts" setup>
@@ -26,6 +32,11 @@ limitations under the License. -->
     traceId: { type: String, default: "" },
     headerType: { type: String, default: "" },
   });
+  const emits = defineEmits(["select"]);
+
+  function getSelectedSpan(span: Span) {
+    emits("select", span);
+  }
 </script>
 <style lang="scss" scoped>
   .trace-table-charts {