feat(D03 지도 겹): 받은 산림 · 환경 자료 겹 다섯 화면 — 국유림 임도 · 산림입지도 · 경제림 · 생태자연도 · 산사태 = 서버 줌별 조각 고정 소스 · 범례 · 받는 동안 서클 (PLAN 622-2 · 요구 529)

- 공용 부품 tileSource(벡터 pbf · 그림 png) 덧 · 새 파일 UI_ForestLayers(꼴 · 소스 · 범례 · 토양 무리 색)
- 산림입지도 그림 = forest_soil 조각(z10 이상) · 브이월드 받기 · 요약 그대로 · 범례 · 옛 캔버스 색 = 같은 토양 무리 색
- 산사태위험 GL = 조각 그림(받기 없음) · 옛 캔버스 = 받은 범위 한 장 그대로(끌 때 받음)
- 새 겹 셋(국유림 임도 · 경제림 · 생태자연도) 처음 끔 · 옛 캔버스엔 안 보임 · 색 토큰 --draw-map-* 덧 · 아이콘 trees · plant 덧
- UI_Layers 688 → 680 줄(GL 글꼴 미리 받기 = UI_MapGl 로 · 브이월드 토양 GL 꼬리표 뺌)
- 지킴 시험 test_622_2_forest_layers

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

ui_template/ui_template_gl_map.ts

@@ -76,6 +76,23 @@ export function contourTileSource(projectId: string): SourceSpecification {
   };
 }
 
+/** 서버 줌별 조각(PLAN 622 · `…/plan/<path>/{z}/{x}/{y}.<ext>`) — pbf = 벡터(겹 이름 = 자료 이름) · png = 그림 256 px. */
+export function tileSource(
+  projectId: string,
+  path: string,
+  ext: "pbf" | "png",
+  minzoom: number,
+  maxzoom: number,
+): SourceSpecification {
+  const tiles = [
+    `${location.origin}${API_BASE_URL}/projects/${projectId}/plan/${path}/{z}/{x}/{y}.${ext}`,
+  ];
+  const bounds: [number, number, number, number] = [124, 33, 132, 39];
+  return ext === "pbf"
+    ? { type: "vector", tiles, minzoom, maxzoom, bounds }
+    : { type: "raster", tiles, tileSize: 256, minzoom, maxzoom, bounds };
+}
+
 /** 느린 조작 잼(600-4) — `globalThis.__aisloPerf = true` 일 때만 `performance.measure(이름)` 으로 걸린 ms 를 남김(꺼져 있으면 그냥 실행). */
 export function perfTime<T>(name: string, run: () => T): T {
   if (!(globalThis as { __aisloPerf?: boolean }).__aisloPerf) return run();

ui_template/ui_template_icons.ts

@@ -153,6 +153,11 @@ const PATHS = {
     "M12.802 2.165l5.575 2.389c.48 .206 .863 .589 1.07 1.07l2.388 5.574c.22 .512 .22 1.092 0 1.604l-2.389 5.575c-.206 .48 -.589 .863 -1.07 1.07l-5.574 2.388c-.512 .22 -1.092 .22 -1.604 0l-5.575 -2.389a2.036 2.036 0 0 1 -1.07 -1.07l-2.388 -5.574a2.036 2.036 0 0 1 0 -1.604l2.389 -5.575c.206 -.48 .589 -.863 1.07 -1.07l5.574 -2.388a2.036 2.036 0 0 1 1.604 0z|M12 8v4|M12 16h.01",
   // 585-3 — 연도 구역 마커(D03 도구줄 끌어 놓기)
   flag: "M5 5a5 5 0 0 1 7 0a5 5 0 0 0 7 0v9a5 5 0 0 1 -7 0a5 5 0 0 0 -7 0v-9z|M5 21v-7",
+  // 622-2 — 지도 겹(경제림 · 생태자연도)
+  trees:
+    "M16 5l3 3l-2 1l4 4l-3 1l4 4h-9|M15 21l0 -3|M8 13l-2 -2|M8 12l2 -2|M8 21v-13|M5.824 16a3 3 0 0 1 -2.743 -3.69a3 3 0 0 1 .304 -4.833a3 3 0 0 1 4.615 -3.707a3 3 0 0 1 4.614 3.707a3 3 0 0 1 .305 4.833a3 3 0 0 1 -2.919 3.695h-4z",
+  plant:
+    "M7 15h10v4a2 2 0 0 1 -2 2h-6a2 2 0 0 1 -2 -2z|M12 9a6 6 0 0 0 -6 -6h-3v2a6 6 0 0 0 6 6h3|M12 11a6 6 0 0 1 6 -6h3v1a6 6 0 0 1 -6 6h-3|M12 15l0 -6",
 } as const;
 
 export type IconName = keyof typeof PATHS;

ui_template/ui_template_theme.css

@@ -569,7 +569,7 @@ html.is-bm-route .m01lab-src__body * {
   --draw-map-zone-wetland: #2dd4bf; /* 습지보호지역 */
   --draw-map-zone-wildlife: #eab308; /* 야생생물보호구역 */
   --draw-map-zone-greenbelt: #f97316; /* 개발제한구역 */
-  --draw-map-soil-1: #fef3c7; /* 산림입지도 토양형 — 받은 범위 안 코드 차례(흙빛 · 급경사 노랑과 다름) */
+  --draw-map-soil-1: #fef3c7; /* 산림입지도 토양 무리 — 갈색 · 적황색 · 암적색 · 회갈색 화산회 · 침식 미숙 · 그 밖(흙빛 · 급경사 노랑과 다름) */
   --draw-map-soil-2: #f5c08a;
   --draw-map-soil-3: #d9895a;
   --draw-map-soil-4: #bef264;
@@ -585,6 +585,15 @@ html.is-bm-route .m01lab-src__body * {
   --draw-map-zero-order: #7dd3fc; /* 0차곡(지형 추정 골짜기 머리 · 점선) */
   --draw-map-forest-road-file: #ff2fd0; /* 올린 임도망도(실선 · 검은 테 · 위성 위 밝은 분홍 · 짐작 = 주황 점선) */
   --draw-map-landslide-zone: #e11d48; /* 산사태취약지역 점 · 필지 테두리 */
+  --draw-map-national-road-main: #ff6b00; /* 국유림 임도 간선(실선 · 검은 테 · 짐작 = 주황 점선과 가름) */
+  --draw-map-national-road-work: #ffd23f; /* 국유림 임도 작업 */
+  --draw-map-national-road-fire: #ff3b3b; /* 국유림 임도 산불 */
+  --draw-map-eco-national: #34d399; /* 경제림육성단지 국유(테두리) */
+  --draw-map-eco-private: #a78bfa; /* 경제림육성단지 사유(테두리) */
+  --draw-map-ecology-1: #2e9e4f; /* 생태자연도 1등급(환경부 원도 색 — 범례만) */
+  --draw-map-ecology-2: #b5d96b; /* 2등급 */
+  --draw-map-ecology-3: #f2f2c2; /* 3등급 */
+  --draw-map-ecology-x: #9b7bd4; /* 별도관리지역 */
   --draw-map-sketch: #ffe94d; /* 지도 위 그림(테마 안 따름 · 검은 테와 함께) — 긋기 미리보기 · 그리는 선 · 고름 강조 · 마커 */
   --draw-map-measure: #ffffff; /* 거리재기 */
   --draw-map-warn: #ff5a4d; /* 긋기 막힘(경고) */