feat: enrich earth bgp event visualization

frontend/public/earth/js/main.js

@@ -78,6 +78,18 @@ import {
   updateBGPVisualState,
   clearBGPData,
   toggleBGP,
+  formatBGPAnomalyTypeLabel,
+  formatBGPASPath,
+  formatBGPCollectorStatus,
+  formatBGPConfidence,
+  formatBGPImpactedScope,
+  formatBGPLocation,
+  formatBGPObservedTime,
+  formatBGPObservedBy,
+  formatBGPRouteChange,
+  formatBGPSeverityLabel,
+  formatBGPStatusLabel,
+  showBGPEventOverlay,
 } from "./bgp.js";
 import {
   setupControls,
@@ -140,6 +152,7 @@ const scratchCameraToEarth = new THREE.Vector3();
 const scratchCableCenter = new THREE.Vector3();
 const scratchCableDirection = new THREE.Vector3();
 const scratchBGPDirection = new THREE.Vector3();
+const scratchBGPWorldPosition = new THREE.Vector3();
 
 const cleanupFns = [];
 const DRAG_ROTATION_FACTOR = 0.005;
@@ -262,18 +275,36 @@ function showSatelliteInfo(props) {
 
 function showBGPInfo(marker) {
   setLegendMode("bgp");
+  const impactedRegions =
+    Array.isArray(marker.userData.impacted_regions) &&
+    marker.userData.impacted_regions.length > 0
+      ? marker.userData.impacted_regions
+      : [
+          {
+            city: marker.userData.city,
+            country: marker.userData.country,
+          },
+        ];
   showInfoCard("bgp", {
-    anomaly_type: marker.userData.anomaly_type,
-    severity: marker.userData.rawSeverity || marker.userData.severity,
-    status: marker.userData.status,
+    anomaly_type: formatBGPAnomalyTypeLabel(marker.userData.anomaly_type),
+    severity: formatBGPSeverityLabel(
+      marker.userData.rawSeverity || marker.userData.severity,
+    ),
+    status: formatBGPStatusLabel(marker.userData.status),
+    route_change: formatBGPRouteChange(
+      marker.userData.origin_asn,
+      marker.userData.new_origin_asn,
+    ),
     prefix: marker.userData.prefix,
+    as_path_display: formatBGPASPath(marker.userData.as_path),
     origin_asn: marker.userData.origin_asn,
     new_origin_asn: marker.userData.new_origin_asn,
-    confidence: marker.userData.confidence,
+    confidence: formatBGPConfidence(marker.userData.confidence),
     collector: marker.userData.collector,
-    country: marker.userData.country,
-    city: marker.userData.city,
-    created_at: marker.userData.created_at,
+    observed_by: formatBGPObservedBy(marker.userData.collectors),
+    impacted_scope: formatBGPImpactedScope(impactedRegions),
+    location: formatBGPLocation(marker.userData.city, marker.userData.country),
+    created_at: formatBGPObservedTime(marker.userData.created_at_raw),
     summary: marker.userData.summary,
   });
 }
@@ -282,10 +313,9 @@ function showBGPCollectorInfo(marker) {
   setLegendMode("bgp");
   showInfoCard("bgp_collector", {
     collector: marker.userData.collector,
-    country: marker.userData.country,
-    city: marker.userData.city,
+    location: formatBGPLocation(marker.userData.city, marker.userData.country),
     anomaly_count: marker.userData.anomaly_count ?? 0,
-    status: marker.userData.status || "online",
+    status: formatBGPCollectorStatus(marker.userData.status || "online"),
   });
 }
 
@@ -793,7 +823,11 @@ function getFrontFacingBGPMarkers(markers) {
   scratchCameraToEarth.subVectors(camera.position, earth.position).normalize();
 
   return markers.filter((marker) => {
-    scratchBGPDirection.copy(marker.position).normalize();
+    scratchBGPWorldPosition.copy(marker.position);
+    marker.parent?.localToWorld(scratchBGPWorldPosition);
+    scratchBGPDirection
+      .subVectors(scratchBGPWorldPosition, earth.position)
+      .normalize();
     return scratchCameraToEarth.dot(scratchBGPDirection) > 0;
   });
 }
@@ -1032,6 +1066,7 @@ function onClick(event) {
     lockedObject = clickedMarker;
     lockedObjectType = "bgp";
     setAutoRotate(false);
+    showBGPEventOverlay(clickedMarker, earth);
     showBGPInfo(clickedMarker);
     showStatusMessage(
       `已选择BGP异常: ${clickedMarker.userData.collector}`,