Refine compass and ruler overlay

miniprogram/engine/map/mapEngine.ts

@@ -23,7 +23,7 @@ const RENDER_MODE = 'Single WebGL Pipeline'
 const PROJECTION_MODE = 'WGS84 -> WorldTile -> Camera -> Screen'
 const MAP_NORTH_OFFSET_DEG = 0
 let MAGNETIC_DECLINATION_DEG = -6.91
-let MAGNETIC_DECLINATION_TEXT = '6.91掳 W'
+let MAGNETIC_DECLINATION_TEXT = '6.91˚ W'
 const MIN_ZOOM = 15
 const MAX_ZOOM = 20
 const DEFAULT_ZOOM = 17
@@ -129,6 +129,7 @@ export interface MapEngineViewState {
   tileTranslateX: number
   tileTranslateY: number
   tileSizePx: number
+  previewScale: number
   stageWidth: number
   stageHeight: number
   stageLeft: number
@@ -232,6 +233,8 @@ const VIEW_SYNC_KEYS: Array<keyof MapEngineViewState> = [
   'mapName',
   'configStatusText',
   'zoom',
+  'centerTileX',
+  'centerTileY',
   'rotationDeg',
   'rotationText',
   'rotationMode',
@@ -263,6 +266,11 @@ const VIEW_SYNC_KEYS: Array<keyof MapEngineViewState> = [
   'networkFetchCount',
   'cacheHitRateText',
   'tileSizePx',
+  'previewScale',
+  'stageWidth',
+  'stageHeight',
+  'stageLeft',
+  'stageTop',
   'statusText',
   'gpsTracking',
   'gpsTrackingText',
@@ -393,12 +401,16 @@ function formatRotationText(rotationDeg: number): string {
   return `${Math.round(normalizeRotationDeg(rotationDeg))}deg`
 }
 
+function normalizeDegreeDisplayText(text: string): string {
+  return text.replace(/[°掳•]/g, '˚')
+}
+
 function formatHeadingText(headingDeg: number | null): string {
   if (headingDeg === null) {
     return '--'
   }
 
-  return `${Math.round(normalizeRotationDeg(headingDeg))}掳`
+  return `${Math.round(normalizeRotationDeg(headingDeg))}˚`
 }
 
 function formatDevicePoseText(pose: 'upright' | 'tilted' | 'flat'): string {
@@ -1011,6 +1023,7 @@ export class MapEngine {
       tileTranslateX: 0,
       tileTranslateY: 0,
       tileSizePx: 0,
+      previewScale: 1,
       stageWidth: 0,
       stageHeight: 0,
       stageLeft: 0,
@@ -2114,7 +2127,7 @@ export class MapEngine {
 
   applyRemoteMapConfig(config: RemoteMapConfig): void {
     MAGNETIC_DECLINATION_DEG = config.magneticDeclinationDeg
-    MAGNETIC_DECLINATION_TEXT = config.magneticDeclinationText
+    MAGNETIC_DECLINATION_TEXT = normalizeDegreeDisplayText(config.magneticDeclinationText)
     this.minZoom = config.minZoom
     this.maxZoom = config.maxZoom
     this.defaultZoom = config.defaultZoom
@@ -3168,6 +3181,9 @@ export class MapEngine {
     this.previewScale = scale
     this.previewOriginX = originX
     this.previewOriginY = originY
+    this.setState({
+      previewScale: scale,
+    }, true)
   }
 
   resetPreviewState(): void {