diff --git a/B05_wf2_Route/B05_wf2_Route_UI_Style.css b/B05_wf2_Route/B05_wf2_Route_UI_Style.css index 2fa07c92..d7be12f0 100644 --- a/B05_wf2_Route/B05_wf2_Route_UI_Style.css +++ b/B05_wf2_Route/B05_wf2_Route_UI_Style.css @@ -134,6 +134,8 @@ left: 0; top: 0; box-sizing: border-box; + /* 자기 그래프 영역 밖으로 눈금이 새면 아래 그래프의 축처럼 읽힌다. */ + overflow: hidden; /* SVG 배경(b06-chart__bg)과 같은 색으로 스크롤되는 그래프를 가려 값 누출을 막는다. */ background: var(--color-surface-raised); border-right: 1px solid var(--color-text-secondary); diff --git a/common_util/common_util_mass_haul_view.ts b/common_util/common_util_mass_haul_view.ts index a64a68cf..1e31e8ba 100644 --- a/common_util/common_util_mass_haul_view.ts +++ b/common_util/common_util_mass_haul_view.ts @@ -321,7 +321,9 @@ export function createMassHaulChart( for (const ratio of tickRatios) { const gridY = MASS_PAD_TOP + ratio * plotHeight; const value = max - ratio * span; - axisTicks.push({ y: gridY, label: formatVolume(value) }); + // 고정 축 라벨에는 단위를 붙인다 — 바로 위 종단 그래프의 표고축(`…m`)과 같은 자리에 + // 서므로, 단위가 없으면 어느 축인지 읽히지 않는다(2026-08-03 사용자 지적). + axisTicks.push({ y: gridY, label: `${formatVolume(value)}㎥` }); svg.append( svgElement("line", { x1: axisX, @@ -341,7 +343,7 @@ export function createMassHaulChart( const zeroY = y(0); // 0선은 격자보다 진하게 따로 그리므로 고정 축 눈금에도 함께 실어 준다. - axisTicks.push({ y: zeroY, label: "0" }); + axisTicks.push({ y: zeroY, label: "0㎥" }); onAxis?.({ padLeft: axisX, ticks: axisTicks }); const visible = series.filter((entry) => visibleKeys.has(entry.key));