체류중 배지 초상화 위 배치 보정

js/main.js

@@ -483,6 +483,10 @@ const PLAYBACK_MIN_VISIBLE_STEPS = 80;
 const PLAYBACK_TICK_MS = 160;
 const STAY_MIN_SECONDS = 10 * 60;
 const STAY_GROUP_RADIUS_M = 100;
+const FACE_MARKER_SIZE = 60;
+const CURRENT_STAY_BADGE_WIDTH = 140;
+const CURRENT_STAY_BADGE_HEIGHT = 28;
+const CURRENT_STAY_BADGE_GAP = 8;
 
 const FALLBACK_BACK_TARGET = 'https://chaegeon.com/';
 const BACK_HISTORY_KEY = 'chaegeon.backHistory.v1';
@@ -2228,7 +2232,7 @@ function moveSelectedHistoryPoint(index, pan = false, syncSlider = true) {
     }
 }
 
-function createFaceMarkerIcon(size = 60) {
+function createFaceMarkerIcon(size = FACE_MARKER_SIZE) {
     const half = size / 2;
     return {
         content: `<div style="width:${size}px; height:${size}px; background:url('https://chaegeon.com/custom/findmydevice/img/30c0fc9d9.png') no-repeat center/contain;"></div>`,
@@ -2237,16 +2241,11 @@ function createFaceMarkerIcon(size = 60) {
 }
 
 function createCurrentStayIcon(text) {
-    const wrapStyle = [
+    const anchorX = CURRENT_STAY_BADGE_WIDTH / 2;
-        'position:relative',
+    const anchorY = (FACE_MARKER_SIZE / 2) + CURRENT_STAY_BADGE_GAP + CURRENT_STAY_BADGE_HEIGHT;
-        'width:0',
-        'height:0',
-        'pointer-events:none',
-        'transform:translate(-50%,-82px)'
-    ].join(';');
     return {
-        content: `<div class="current-stay-badge-wrap" style="${wrapStyle}"><div class="history-marker history-marker-stay current-stay-badge">${text}</div></div>`,
+        content: `<div class="history-marker history-marker-stay current-stay-badge">${text}</div>`,
-        anchor: new naver.maps.Point(0, 0)
+        anchor: new naver.maps.Point(anchorX, anchorY)
     };
 }