+
자유 시점
- setBaseMap(baseMap === 'ocean' ? 'enhanced' : 'ocean')}
- title="Ocean 전용 지도 (해양 정보 극대화)"
- className="px-2 py-0.5 text-[9px]"
- >
- Ocean
-
setProjection((p) => (p === 'globe' ? 'mercator' : 'globe'))}
@@ -185,6 +177,31 @@ export function DashboardSidebar({
>
3D
+
+ setBaseMap('enhanced')}
+ title="기본 지도 (MapTiler Enhanced)"
+ className="px-2 py-0.5 text-[9px]"
+ >
+ Base
+
+ setBaseMap('osm')}
+ title="OSM 기본 래스터 지도"
+ className="px-2 py-0.5 text-[9px]"
+ >
+ OSM
+
+ setBaseMap('ocean')}
+ title="Ocean 전용 지도 (해양 정보 극대화)"
+ className="px-2 py-0.5 text-[9px]"
+ >
+ Ocean
+
}
>
diff --git a/apps/web/src/widgets/map3d/hooks/useBaseMapToggle.ts b/apps/web/src/widgets/map3d/hooks/useBaseMapToggle.ts
index b9f3287..7d30a91 100644
--- a/apps/web/src/widgets/map3d/hooks/useBaseMapToggle.ts
+++ b/apps/web/src/widgets/map3d/hooks/useBaseMapToggle.ts
@@ -63,6 +63,7 @@ export function useBaseMapToggle(
const apply = () => {
if (!map.isStyleLoaded()) return;
+ if (baseMap === 'osm') return;
const seaVisibility = 'visible' as const;
const seaRegex = /(water|sea|ocean|river|lake|coast|bay)/i;
diff --git a/apps/web/src/widgets/map3d/layers/bathymetry.ts b/apps/web/src/widgets/map3d/layers/bathymetry.ts
index 0ad3e2e..5bc8904 100644
--- a/apps/web/src/widgets/map3d/layers/bathymetry.ts
+++ b/apps/web/src/widgets/map3d/layers/bathymetry.ts
@@ -394,6 +394,23 @@ export async function resolveMapStyle(baseMap: BaseMapId, signal: AbortSignal):
const { resolveOceanStyle } = await import('../../../features/oceanMap/lib/resolveOceanStyle');
return resolveOceanStyle(signal);
}
+ if (baseMap === 'osm') {
+ void signal;
+ return {
+ version: 8,
+ name: 'OSM Raster',
+ glyphs: 'https://demotiles.maplibre.org/font/{fontstack}/{range}.pbf',
+ sources: {
+ osm: {
+ type: 'raster',
+ tiles: ['https://tile.openstreetmap.org/{z}/{x}/{y}.png'],
+ tileSize: 256,
+ attribution: '© OpenStreetMap contributors',
+ },
+ },
+ layers: [{ id: 'osm', type: 'raster', source: 'osm' }],
+ } satisfies StyleSpecification;
+ }
// 레거시 베이스맵 비활성 — 향후 위성/라이트 테마 등 추가 시 재활용
// if (baseMap === 'legacy') return '/map/styles/carto-dark.json';
void baseMap;
diff --git a/apps/web/src/widgets/map3d/types.ts b/apps/web/src/widgets/map3d/types.ts
index af087a7..417154d 100644
--- a/apps/web/src/widgets/map3d/types.ts
+++ b/apps/web/src/widgets/map3d/types.ts
@@ -14,7 +14,7 @@ export type Map3DSettings = {
showDensity: boolean;
};
-export type BaseMapId = 'enhanced' | 'ocean' | 'legacy';
+export type BaseMapId = 'enhanced' | 'osm' | 'ocean' | 'legacy';
export type MapProjectionId = 'mercator' | 'globe';
export interface MapViewState {