|
|
|
@ -262,6 +262,7 @@ const routeMapEl = ref(null) |
|
|
|
const routeMapReady = ref(false) |
|
|
|
let routeMapInstance = null |
|
|
|
let routeMapAttached = false |
|
|
|
let pendingStyleHandler = null |
|
|
|
|
|
|
|
const routeForm = reactive({ name: '', altitude: 50, speed: 10, turnMode: 'auto' }) |
|
|
|
const routePoints = ref([]) |
|
|
|
@ -609,22 +610,34 @@ async function attachRouteMap() { |
|
|
|
routeMapAttached = true |
|
|
|
routeMapReady.value = true |
|
|
|
|
|
|
|
clearTaskLayers(map) |
|
|
|
ensureTaskLayers(map) |
|
|
|
|
|
|
|
map.on('click', onRouteMapClick) |
|
|
|
map.on('mousemove', onRouteMapMove) |
|
|
|
|
|
|
|
const c = map.getCenter() |
|
|
|
routeCursor.value = formatCoord(c.lng, c.lat) |
|
|
|
const boot = () => { |
|
|
|
pendingStyleHandler = null |
|
|
|
if (!routeMapAttached || routeMapInstance !== map) return |
|
|
|
clearTaskLayers(map) |
|
|
|
ensureTaskLayers(map) |
|
|
|
map.on('click', onRouteMapClick) |
|
|
|
map.on('mousemove', onRouteMapMove) |
|
|
|
const c = map.getCenter() |
|
|
|
routeCursor.value = formatCoord(c.lng, c.lat) |
|
|
|
requestAnimationFrame(() => { |
|
|
|
map.resize() |
|
|
|
syncRouteLayer() |
|
|
|
}) |
|
|
|
} |
|
|
|
|
|
|
|
requestAnimationFrame(() => { |
|
|
|
map.resize() |
|
|
|
syncRouteLayer() |
|
|
|
}) |
|
|
|
if (map.isStyleLoaded()) { |
|
|
|
boot() |
|
|
|
} else { |
|
|
|
pendingStyleHandler = boot |
|
|
|
map.once('load', pendingStyleHandler) |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
function teardownRouteMap() { |
|
|
|
if (routeMapInstance && pendingStyleHandler) { |
|
|
|
routeMapInstance.off('load', pendingStyleHandler) |
|
|
|
pendingStyleHandler = null |
|
|
|
} |
|
|
|
if (routeMapInstance) { |
|
|
|
routeMapInstance.off('click', onRouteMapClick) |
|
|
|
routeMapInstance.off('mousemove', onRouteMapMove) |
|
|
|
|