feat(B05): 진입 로딩 3D 후순위 · 도넛 회전 분리 · 직교/원근 전환 단추
사용자 지시(2026-09-04) — 「3D 는 보조라 후순위. 조용히 뒤에서 뜨고 다 되면 팝업으로 알릴 것. 로딩 도넛은 진행률과 무관하게 계속 돌고 숫자만 갱신」, 그리고 「직교/원근 전환 단추는 넣음」. 진입 로딩 - 단계 5 → 4. ④ 종·횡단 자료까지 끝나면 로딩 표시를 걷어 화면을 바로 쓰게 함. - 3D 지형은 finally 뒤 배경 작업으로 돌리고 끝나면 토스트 「3D 지형 준비 완료」. 실패해도 나머지 화면은 그대로 씀. [초기화]는 재진입이라 같은 규칙이 걸림. - 「확정 지표면 없음」 판정을 ③ 뒤로 앞당김. 진행 서클(공용) - 회전 껍데기(`__spin`)를 한 겹 두고 CSS 회전을 거기에만 검. 껍데기는 늘 돌고 안쪽 svg 는 12시 고정이라 호·숫자가 제자리에서 갱신됨. `is-indeterminate` 제거. 직교/원근 전환 - 카메라 두 벌을 `B05_Profile_UI_Viewer_Camera.ts` 가 쥐고 갈아 끼움. 위치·시선· 근평면·먼평면과 보이는 크기를 옮겨 화면이 튀지 않음. - 마커 입력·구조물 클릭·커서 피벗 유틸이 카메라를 함수로 받게 바꿈(공용 유틸은 값도 그대로 받아 B04 호출부는 무변경). 자체검증(공용 브라우저 5173, 용화_LAS) — 진행률 25→50→75%, 회전 애니메이션 running 유지(변환행렬 표본 전부 다름), 로딩 걷힌 순간 그래프선 2·좌측단추 61· 3D 메쉬 2, 1.8초 뒤 메쉬 489 + 토스트. 초기화 재진입도 같음. 전환 단추는 Ortho ↔ Perspective 왕복 후 값 완전 일치, B04 페이지 오류 0건. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
@@ -61,22 +61,27 @@ export function createProgressCircle(options: ProgressCircleOptions = {}): Progr
|
||||
label.className = "ui-progress-circle__label";
|
||||
label.textContent = options.label ?? "";
|
||||
|
||||
// 회전은 진행률과 **따로 논다**(2026-09-04 사용자 지시) — 무거운 단계에서 호가
|
||||
// 안 늘어도 도넛은 계속 돌아야 "멈춘 것"으로 안 보인다. 바깥 껍데기만 CSS로 돌리고
|
||||
// 안쪽 svg는 12시 고정이라, 호·숫자는 제자리에서 갱신된다.
|
||||
const spin = document.createElement("div");
|
||||
spin.className = "ui-progress-circle__spin";
|
||||
spin.append(svg);
|
||||
|
||||
const dial = document.createElement("div");
|
||||
dial.className = "ui-progress-circle__dial";
|
||||
dial.append(svg, percent);
|
||||
dial.append(spin, percent);
|
||||
root.append(dial, label);
|
||||
|
||||
function set(ratio: number | null, nextLabel?: string): void {
|
||||
if (nextLabel !== undefined) label.textContent = nextLabel;
|
||||
if (ratio === null) {
|
||||
// 진행률 미상 — 4분의 1 호를 돌려 "돌아가는 중"만 알린다.
|
||||
root.classList.add("is-indeterminate");
|
||||
// 진행률 미상 — 4분의 1 호만 남긴다(회전은 껍데기가 늘 맡는다).
|
||||
bar.setAttribute("stroke-dashoffset", String(CIRCUMFERENCE * 0.75));
|
||||
percent.textContent = "";
|
||||
return;
|
||||
}
|
||||
const clamped = Math.min(1, Math.max(0, ratio));
|
||||
root.classList.remove("is-indeterminate");
|
||||
bar.setAttribute("stroke-dashoffset", String(CIRCUMFERENCE * (1 - clamped)));
|
||||
percent.textContent = `${Math.round(clamped * 100)}%`;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user