管理端开发日记⑤：地图航线与无人机定位

1
function normalizePoint(point = {}) {
2
  const latitude = Number(point.latitude ?? point.lat ?? point.y)
3
  const longitude = Number(point.longitude ?? point.lng ?? point.x)
4
  return Number.isFinite(latitude) && Number.isFinite(longitude)
5
    ? { latitude, longitude }
6
    : null
7
}

1
loadDetail
2
   ├─ 读取订单和飞行任务
3
   ├─ 加载天地图脚本
4
   └─ nextTick
5
         ├─ initMap
6
         ├─ renderBaseRoute
7
         └─ startDroneAnimation

1
function renderWayline(points) {
2
  const validPoints = points.map(normalizePoint).filter(Boolean)
3
  if (validPoints.length < 2) return renderBaseRoute()
4

5
  routePolyline = new T.Polyline(
6
    validPoints.map(p => new T.LngLat(p.longitude, p.latitude)),
7
    { color: '#1769e8', weight: 6, opacity: 0.9 }
8
  )
9
  map.addOverLay(routePolyline)
10
  addEndpointMarker(validPoints[0], 'start')
11
  addEndpointMarker(validPoints.at(-1), 'end')
12
}

1
droneMarker.setLngLat(
2
  new T.LngLat(point.longitude, point.latitude)
3
)

1
const segmentDuration = totalDuration * segmentDistance / totalDistance
2

3
function interpolate(start, end, progress) {
4
  return {
5
    longitude: start.longitude + (end.longitude - start.longitude) * progress,
6
    latitude: start.latitude + (end.latitude - start.latitude) * progress
7
  }
8
}

1
function stopDroneAnimation() {
2
  if (animationFrameId) cancelAnimationFrame(animationFrameId)
3
  animationFrameId = 0
4
}
5

6
onBeforeUnmount(() => {
7
  stopDroneAnimation()
8
  map?.clearOverLays?.()
9
  map = null
10
})