From 0899223c75cdac182994468313a82f87a541bee5 Mon Sep 17 00:00:00 2001
From: htlee <htlee@gcsc.co.kr>
Date: Sun, 15 Feb 2026 18:55:57 +0900
Subject: [PATCH] fix(map): keep bathymetry visible when overzooming

---
 apps/web/src/widgets/map3d/Map3D.tsx | 17 ++++++++++-------
 1 file changed, 10 insertions(+), 7 deletions(-)

diff --git a/apps/web/src/widgets/map3d/Map3D.tsx b/apps/web/src/widgets/map3d/Map3D.tsx
index 8024f03..dce2dd8 100644
--- a/apps/web/src/widgets/map3d/Map3D.tsx
+++ b/apps/web/src/widgets/map3d/Map3D.tsx
@@ -859,7 +859,8 @@ function injectOceanBathymetryLayers(style: StyleSpecification, maptilerKey: str
     // which may exceed MapLibre's per-segment 16-bit vertex limit and render incorrectly.
     // We keep the fill starting at a more reasonable zoom.
     minzoom: 6,
-    maxzoom: 12,
+    // Source maxzoom is 12, but we allow overzoom so the bathymetry doesn't disappear when zooming in.
+    maxzoom: 24,
     paint: {
       // Dark-mode friendly palette (shallow = slightly brighter; deep = near-black).
       "fill-color": bathyFillColor,
@@ -875,7 +876,7 @@ function injectOceanBathymetryLayers(style: StyleSpecification, maptilerKey: str
     source: oceanSourceId,
     "source-layer": "contour",
     minzoom: 6,
-    maxzoom: 14,
+    maxzoom: 24,
     paint: {
       "line-color": "rgba(255,255,255,0.06)",
       "line-opacity": ["interpolate", ["linear"], ["zoom"], 4, 0.12, 8, 0.18, 12, 0.22],
@@ -923,7 +924,7 @@ function injectOceanBathymetryLayers(style: StyleSpecification, maptilerKey: str
     source: oceanSourceId,
     "source-layer": "contour_line",
     minzoom: 8,
-    maxzoom: 14,
+    maxzoom: 24,
     filter: bathyMajorDepthFilter as unknown as unknown[],
     paint: {
       "line-color": "rgba(255,255,255,0.16)",
@@ -939,7 +940,7 @@ function injectOceanBathymetryLayers(style: StyleSpecification, maptilerKey: str
     source: oceanSourceId,
     "source-layer": "contour",
     minzoom: 4,
-    maxzoom: 14,
+    maxzoom: 24,
     filter: bathyMajorDepthFilter as unknown as unknown[],
     paint: {
       "line-color": "rgba(255,255,255,0.14)",
@@ -1031,9 +1032,11 @@ type BathyZoomRange = {
 };
 
 const BATHY_ZOOM_RANGES: BathyZoomRange[] = [
-  { id: "bathymetry-fill", mercator: [6, 12], globe: [8, 12] },
-  { id: "bathymetry-borders", mercator: [6, 14], globe: [8, 14] },
-  { id: "bathymetry-borders-major", mercator: [4, 14], globe: [8, 14] },
+  // MapTiler Ocean tiles maxzoom=12; beyond that we overzoom the z12 geometry.
+  // Keep rendering at high zoom so the sea doesn't revert to the basemap's flat water color.
+  { id: "bathymetry-fill", mercator: [6, 24], globe: [8, 24] },
+  { id: "bathymetry-borders", mercator: [6, 24], globe: [8, 24] },
+  { id: "bathymetry-borders-major", mercator: [4, 24], globe: [8, 24] },
 ];
 
 function applyBathymetryZoomProfile(map: maplibregl.Map, baseMap: BaseMapId, projection: MapProjectionId) {