260707_2

.agent/frontend.md

@@ -15,11 +15,14 @@
 ### 2.1 공통 컴포넌트 목록 (`ui_template_elements.ts`)
 * **기본:** `createButton`, `createInputField`, `createCard`, `createTag`, `createWorkflowShell`
 * **오버레이/알림:** `showLoadingOverlay`, `hideLoadingOverlay`, `showToast`
-* **라인 차트:** `createLineChart(opts)` — 외부 라이브러리 없이 인라인 SVG로 시계열 렌더링
-  - 색상은 `--color-chart-0~3` 테마 변수 사용 (하드코딩 금지)
-  - `series[].values`에 `null` 포함 시 해당 구간 선 끊김 처리
+* **스플라인 차트:** `createLineChart(opts)` — 외부 라이브러리 없이 인라인 SVG로 시계열 렌더링
+  - **곡선:** Catmull-Rom → 3차 베지어 변환으로 스플라인(부드러운 곡선) 렌더
+  - **색상:** `--color-chart-0~3` 테마 변수 사용 (하드코딩 금지)
+  - **범례:** 그래프 영역 우상단에 반투명 오버레이 배치 (`opts.series[].name`)
+  - **X축:** `opts.xLabels` 전달 시 양끝 포함 5개 라벨 균등 표기
+  - **결측:** `series[].values`에 `null` 포함 시 해당 구간 선 끊김 처리
   - 데이터 2점 미만이면 빈 상태(`—`) 반환
-  - 사용 예: B01_Dashboard 리소스 현황(CPU/메모리/디스크 30일 추이)
+  - 사용 예: B01_Dashboard 리소스 현황(CPU/메모리/디스크 30일 추이, X축=시간)
 
 ---