完成实时飞行轨迹

src/App.vue

@@ -319,6 +319,8 @@ let mouseTool = null
 const mapType = ref('satellite') // 'normal' | 'satellite'
 const dronePath = ref([]) // 无人机轨迹点集合
 let droneTrackLine = null
+const drone2Path = ref([]) // 无人机2轨迹点集合
+let drone2TrackLine = null
 const MAX_TRACK_POINTS = 2000
 
 // 围栏相关状态
@@ -543,7 +545,7 @@ const toggleWebSocket = () => {
         gcoord.GCJ02,       // 目标坐标系
       );
       console.log(point, point2);
-      // updateDroneMarker(point[0], point[1], drone1.heading);
+      updateDroneMarker(point[0], point[1], point2[0], point2[1], drone1.heading);
       // updateDrone2Marker(point2[0], point2[1], drone2.heading);
     };
   }
@@ -572,7 +574,7 @@ const handleDroneData = (data) => {
 }
 
 // 更新无人机marker
-const updateDroneMarker = (lng, lat, heading = 0) => {
+const updateDroneMarker = (lng, lat, lng2, lat2, heading = 0) => {
   if (!map || !AMap) return
 
   if (!droneMarker.value) {
@@ -589,25 +591,40 @@ const updateDroneMarker = (lng, lat, heading = 0) => {
       position: [lng, lat],
       icon: icon,
       zIndex: 100,
-      title: '无人机',
+      title: '侦查机',
       offset: new AMap.Pixel(-20, -20),
       // 优化：禁用动画，减少性能消耗
       animation: 'AMAP_ANIMATION_NONE'
     })
 
     map.add(droneMarker.value)
+
+    drone2Marker.value = new AMap.Marker({
+      position: [lng, lat],
+      icon: icon,
+      zIndex: 100,
+      title: '投弹机',
+      offset: new AMap.Pixel(-20, -20),
+      // 优化：禁用动画，减少性能消耗
+      animation: 'AMAP_ANIMATION_NONE'
+    })
+
+    map.add(drone2Marker.value)
   } else {
     // 更新位置
     droneMarker.value.setPosition([lng, lat])
+    drone2Marker.value.setPosition([lng2, lat2])
 
     // 更新旋转角度（如果有heading数据）
     if (heading !== undefined) {
       droneMarker.value.setAngle(heading)
+      drone2Marker.value.setAngle(heading)
     }
   }
 
   // 更新飞行轨迹
   updateDroneTrack(lng, lat)
+  updateDrone2Track(lng2, lat2)
 
   // 将地图中心移动到无人机位置（可选，可以注释掉）
   map.setCenter([lng, lat])
@@ -638,6 +655,30 @@ const initDroneTrack = () => {
   })
 }
 
+const initDrone2Track = () => {
+  if (!map || !AMap) return
+
+  // 如果已有轨迹线，先移除
+  if (drone2TrackLine) {
+    map.remove(drone2TrackLine)
+  }
+
+  drone2TrackLine = new AMap.Polyline({
+    map,
+    path: [],
+    showDir: true,
+    isOutline: true,
+    outlineColor: 'rgba(0,0,0,0.3)',
+    borderWeight: 2,
+    strokeColor: '#00e0ff',
+    strokeOpacity: 0.8,
+    strokeWeight: 4,
+    lineJoin: 'round',
+    lineCap: 'round',
+    zIndex: 90
+  })
+}
+
 // 更新无人机轨迹
 const updateDroneTrack = (lng, lat) => {
   if (!map || !AMap) return
@@ -656,6 +697,24 @@ const updateDroneTrack = (lng, lat) => {
   }
 }
 
+const updateDrone2Track = (lng, lat) => {
+  if (!map || !AMap) return
+
+  if (!drone2TrackLine) {
+    initDrone2Track()
+  }
+
+  drone2Path.value.push([lng, lat])
+  if (drone2Path.value.length > MAX_TRACK_POINTS) {
+    drone2Path.value.shift()
+  }
+
+  if (drone2TrackLine) {
+    drone2TrackLine.setPath(drone2Path.value)
+  }
+}
+
+
 // 清空无人机轨迹
 const clearDroneTrack = () => {
   dronePath.value = []
@@ -664,6 +723,13 @@ const clearDroneTrack = () => {
   }
 }
 
+const clearDrone2Track = () => {
+  drone2Path.value = []
+  if (drone2TrackLine) {
+    drone2TrackLine.setPath([])
+  }
+}
+
 // 检测点是否在多边形内（射线法）
 const isPointInPolygon = (point, polygon) => {
   const [x, y] = point
@@ -1383,6 +1449,11 @@ onUnmounted(() => {
     wsClient = null
   }
 
+  if (conn) {
+    conn.close()
+    conn = null
+  }
+
   // 清理地图
   if (droneMarker.value) {
     map?.remove(droneMarker.value)