diff --git a/packages/common/business_components/src/ui/map/GisOverlay.js b/packages/common/business_components/src/ui/map/GisOverlay.js index 5e4fb8948..ca22cf9c9 100644 --- a/packages/common/business_components/src/ui/map/GisOverlay.js +++ b/packages/common/business_components/src/ui/map/GisOverlay.js @@ -76,28 +76,54 @@ export default function createOverlayManager(map, vectorLayer, overlayFormatter, const coord = getFeatureLabelCoordinate(feature); if (!Array.isArray(coord)) return null; const key = getCoordinateKey(coord); - + let el = overlayElementMap.get(key); if (!el) { - el = currentFormatter(feature,properties); - overlayElementMap.set(key, el); + if (!currentFormatter || typeof currentFormatter !== 'function') return null; + + const maybeEl = currentFormatter(feature, properties); + + // 1) 동기 HTMLElement + if (maybeEl && typeof maybeEl === 'object' && (maybeEl.nodeType === 1 || maybeEl.tagName)) { + el = maybeEl; + overlayElementMap.set(key, el); + } + // 2) 비동기 Promise + else if (maybeEl && typeof maybeEl.then === 'function') { + maybeEl.then((resolvedEl) => { + if (!resolvedEl || !(resolvedEl.nodeType === 1 || resolvedEl.tagName)) return; + // 이미 다른 사이클에서 만들어졌으면 덮어쓰지 않음 + if (!overlayElementMap.has(key)) overlayElementMap.set(key, resolvedEl); + + let ov = overlayMap.get(key); + if (!ov) { + ov = new Overlay({ element: resolvedEl, positioning: 'bottom-center', offset: [0, -18], stopEvent: true }); + overlayMap.set(key, ov); + try { map.addOverlay(ov); } catch {} + } else { + try { ov.setElement(resolvedEl); } catch {} + } + ov.setPosition(coord); + if (resolvedEl.style) resolvedEl.style.display = 'block'; + }).catch(() => {}); + return null; // 지금은 안 만듦 + } + // 3) 그 외(null/undefined 등) → 안 만듦 + else { + return null; + } } - - let isOverlay = overlayMap.get(key); - if (!isOverlay) { - isOverlay = new Overlay({ - element: el, - positioning: 'bottom-center', - offset: [0, -18], - stopEvent: true, - }); - overlayMap.set(key, isOverlay); - map.addOverlay(isOverlay); + + // 여기까지 왔으면 el은 HTMLElement + let ov = overlayMap.get(key); + if (!ov) { + ov = new Overlay({ element: el, positioning: 'bottom-center', offset: [0, -18], stopEvent: true }); + overlayMap.set(key, ov); + map.addOverlay(ov); } - - isOverlay.setPosition(coord); - if (el && el.style) el.style.display = 'block'; - return isOverlay; + ov.setPosition(coord); + if (el.style) el.style.display = 'block'; + return ov; }; const syncOverlays = () => {