feat(가이드): D02 기준 지정 가이드 글 8 · 그림 8 · 장면 목록(PLAN 542-1 · 요구 359 · 360)

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
This commit is contained in:
2026-10-26 09:21:43 +09:00
co-authored by Claude Sonnet 5.5
parent 564a522a6e
commit 4ee49571de
16 changed files with 202 additions and 53 deletions
+28 -53
View File
@@ -1,59 +1,34 @@
# 기준 지정 설명서
# 기준 지정
## 이 화면에서 하는 일
- 예정노선 1단계. 사업 연도마다 노선의 **시점**과 **종점**을 지도 위에 정하는 화면임.
- 가운데 = 카카오맵(지점과 연도별 선이 그려짐). 왼쪽 = 「연도 지점」 표(지점 이름 · 경도 · 위도 입력칸).
- 정한 지점은 다음 단계(노선 분석)가 길을 찾는 기준이 됨.
- 지점 저장은 산림청만 할 수 있음. 지정받은 다른 회사는 보기만 가능하며 저장하면 「예정노선 지점은 산림청만 고칠 수 있습니다.」 로 막힘.
예정노선 1단계. 사업 연도마다 노선의 시점과 종점을 지도 위에 정하는 화면.
## 여는 길
- [예정노선 등록](D01/00_설명서)에서 [등록]을 누르면 바로 열림.
- 대시보드 프로젝트 표에서 예정노선 줄의 단계 막대 「기준 지정」을 눌러도 열림.
- 이미 만든 예정노선은 어느 단계 화면에서든 ☰ 에서 「기준 지정」을 골라 돌아옴. [단계 이동 메뉴](D02/05_단계_이동_메뉴) 참고.
- 지점 저장은 산림청만 할 수 있음. 지정받은 다른 회사는 보기만 가능하며 저장하면 「예정노선 지점은 산림청만 고칠 수 있습니다.」 안내로 막힘.
![화면 한눈에](D02_00_overview.webp)
## 화면 구역
| 번호 | 구역 | 하는 일 |
| --- | --- | --- |
| 1 | 제목 줄 | 단계 이름(기준 지정)과 프로젝트 이름. 왼쪽 ☰ 로 진행 단계 메뉴를 엶 |
| 2 | 「연도 지점」 표 | 지점마다 줄 하나. 📍 · 경도 · 위도 칸이 있음 |
| 3 | 안내 글 | 지점을 놓는 법 한 줄 안내 |
| 4 | 지도 | 지점 표지와 연도별 선이 그려짐. 지도를 눌러 지점을 놓고, 표지를 끌어 옮김 |
| 5 | 단추 줄 | [?] 가이드 · [<] 이전 · [>] 다음 · [저장] |
## 작업 순서
1. 화면이 열리면 사업 연도 수 + 1 개의 지점 줄이 표에 나타남. 예: 2026 ~ 2027 두 해이면 「2026 시점」 · 「2026 종점 · 2027 시점」 · 「2027 종점」 세 줄.
2. 처음에는 비어 있는 첫 줄이 놓을 지점으로 잡혀 있음(줄이 강조되어 보임).
3. 지도를 눌러 그 지점을 놓음. 놓으면 다음 빈 지점이 자동으로 놓을 지점이 됨.
4. 놓은 뒤 고치려면 지도의 표지를 끌어 옮기거나, 표의 경도 · 위도 칸에 값을 직접 넣음.
5. 모든 줄이 채워지면 연도마다 다른 색의 선이 지점 사이를 이음.
6. [저장] 또는 [>] 를 누름.
## 지점 정하는 방법
| 방법 | 하는 법 | 결과 |
| --- | --- | --- |
| 지도 누름 | 줄 옆 📍 로 놓을 지점을 고른 뒤 지도를 누름 | 그 자리에 표지가 놓임 |
| 표지 끌기 | 지도의 표지를 끌어 놓음 | 표의 값이 따라 바뀜 |
| 좌표 입력 | 경도 · 위도 두 칸에 값을 넣고 칸을 벗어남 | 값이 맞으면 표지가 옮겨짐 · 틀리면 칸이 빨갛게 표시됨 |
1. 화면이 열리면 지점 줄이 사업 연도 수 + 1 개 나타남. 예: 2027 ~ 2029 세 해이면 네 줄. [연도 지점 표](D02/01_연도_지점_표) 참고.
2. 놓을 지점이 줄에서 강조되어 있음. 지도를 눌러 그 지점을 놓음. [지도에서 지점 놓기](D02/02_지도에서_지점_놓기) 참고.
3. 놓은 뒤 고치려면 표지를 끌어 옮기거나 경도 · 위도 칸에 값을 직접 넣음. [좌표 직접 입력](D02/03_좌표_직접_입력) 참고.
4. 모든 줄이 채워지면 연도마다 다른 색의 선이 지점 사이를 이음.
5. [저장] 또는 [>]를 누름. [단추와 저장](D02/04_단추와_저장) 참고.
- 놓을 지점을 고르지 않고 지도를 누르면 「지도에 놓을 지점 고르기」 안내가 나옴.
- 다른 프로그램에서 구한 좌표는 경도 · 위도(WGS84, 소수 7 자리까지 반영)로 넣을 것.
- 경도는 120 ~ 135, 위도는 30 ~ 45 범위만 받음.
> 주의: 서버에는 [저장] 이나 [>]를 눌러야 반영됨. 자동 저장은 없음.
## 연도 표 읽는 법
| 줄 이름 | 뜻 |
| --- | --- |
| 첫 연도 시점 | 노선 전체의 출발점 |
| 앞 연도 종점 · 다음 연도 시점 | 한 점이 두 역할. 앞 연도의 끝이자 다음 연도의 시작 |
| 마지막 연도 종점 | 노선 전체의 도착점 |
- 직전 연도 종점과 다음 연도 시점은 항상 같은 점이며, 하나만 옮기면 두 연도의 선이 함께 움직임.
- 줄 색과 지도 선 색은 연도별로 대응함(6 색을 돌려 씀).
## 단추
| 단추 | 하는 일 |
| --- | --- |
| [?] | 이 도움말 |
| [<] | 이전 단계. 이 화면이 첫 단계라 흐림 |
| [>] | 지점 저장 뒤 다음 단계 「노선 분석」 으로 감 |
| [저장] | 지점을 저장하고 좌표계를 정함 |
| 📍 | 지도를 눌렀을 때 놓을 지점으로 이 줄을 고름 |
| 위 단계 막대 | 「기준 지정」 · 「노선 분석」 · 「확정 · 내보내기」 로 바로 이동 |
## 결과 읽는 법
- 저장하면 「지점을 저장했습니다.」 알림이 뜸.
- 표 아래 한 줄에 「저장 좌표계 EPSG:번호」 와 첫 연도 시점의 X · Y(m)가 나옴. 저장 전에는 「아직 저장 안 함」 이 나옴.
- 저장 전 고친 값은 이 화면을 다시 열어도 같은 브라우저 안에서는 남아 있음. 서버에는 [저장] 이나 [>] 를 눌러야 반영됨(자동 저장 없음).
## 알아 둘 것
- **[>] 와 수치지형도**: [>] 는 지점을 저장한 뒤 「노선 분석」 화면을 엶. 수치지형도(도엽) · 위성 사진 · 연도별 지형면 받기는 그 화면이 열릴 때 뒤에서 시작되며, 이미 받은 범위 안이면 건너뜀. 지점을 저장하지 못하면(예: 빈 지점) 이 화면에 머묾.
- 빈 지점이 남은 채 저장하면 「○○○○년 시점이 비었습니다.」 또는 「○○○○년 종점이 비었습니다.」 로 막힘.
- 연도 범위(시작 · 끝)는 등록 때 정해지며 이 화면에서 바꿀 수 없음.
- **이미 분석 · 확정한 연도의 지점을 옮기면** 그 연도의 분석 노선과 확정 상태가 비워지고 다시 분석해야 함. 1 mm 이내 변화는 같은 지점으로 보아 지우지 않음.
- 좌표계가 바뀌는 경우(「쓰인 방법과 근거」 문서의 좌표계 절)에는 모든 연도의 분석 노선이 비워짐.
- 지도는 카카오맵을 씀. 점이 하나도 없어도 우리나라 가운데쯤을 먼저 보여 줌.
> 참고: 저장하지 않고 고친 값은 같은 브라우저 탭 안에서는 화면을 다시 열어도 남아 있음.
@@ -0,0 +1,33 @@
# 연도 지점 표
왼쪽 패널의 「연도 지점」 카드. 지점마다 줄 하나로 이름 · 📍 · 경도 · 위도를 보여 줌.
## 여는 길
- 기준 지정 화면 왼쪽 패널 맨 위의 「연도 지점」 카드. 제목 오른쪽 ▼ 를 누르면 접고 펼침.
![연도 지점 표](D02_01_points_table.webp)
그림 번호 — 1 안내 글 · 2 지점 한 줄 · 3 📍 단추 · 4 경도 칸 · 5 위도 칸 · 6 저장 좌표계 줄
## 단계
| 단계 | 할 일 |
| --- | --- |
| 1 | 줄 이름으로 어느 지점인지 확인. 첫 줄 = 첫 연도 시점, 마지막 줄 = 마지막 연도 종점. |
| 2 | 줄 왼쪽 색 띠로 어느 연도 선인지 확인. 지도 선 색과 짝(6 색을 돌려 씀). |
| 3 | 사이 줄은 「앞 연도 종점 · 다음 연도 시점」 한 점. 하나만 옮기면 두 연도의 선이 함께 움직임. |
| 4 | 값을 고치는 방법은 [지도에서 지점 놓기](D02/02_지도에서_지점_놓기) · [좌표 직접 입력](D02/03_좌표_직접_입력) 참고. |
## 보이는 것
| 줄 이름 | 뜻 |
| --- | --- |
| 첫 연도 시점 | 노선 전체의 출발점 |
| 앞 연도 종점 · 다음 연도 시점 | 한 점이 두 역할 |
| 마지막 연도 종점 | 노선 전체의 도착점 |
- 표 아래 한 줄 = 저장 상태. 저장 전이면 「아직 저장 안 함」, 저장했으면 「저장 좌표계 EPSG:번호」와 첫 연도 시점의 X · Y(m).
- 산림청이 아닌 계정은 📍 단추가 안 보이고 칸이 잠겨 있음. 보기만 가능.
> 참고: 칸마다 뜻과 규칙은 [칸 뜻](D02/10_칸_뜻)에 있음. 좌표계가 정해지는 방법은 [쓰인 방법과 근거](D02/20_쓰인_방법과_근거) 참고.
@@ -0,0 +1,39 @@
# 지도에서 지점 놓기
지도를 눌러 지점을 놓고, 놓은 표지를 끌어 옮기는 방법.
## 여는 길
- 기준 지정 화면 가운데 지도와 왼쪽 「연도 지점」 표의 📍 단추.
![연도별 선이 그려진 지도](D02_02_year_colors.webp)
그림 번호 — 1 지도 위 안내 글
## 단계
| 단계 | 할 일 |
| --- | --- |
| 1 | 놓을 지점을 고름. 화면이 열리면 비어 있는 첫 줄이 자동으로 골라져 강조됨. 다른 줄에 놓으려면 그 줄의 📍 를 누름. |
| 2 | 지도에서 놓을 자리를 누름. 그 자리에 표지가 놓이고 표의 경도 · 위도가 채워짐. |
| 3 | 놓고 나면 다음 빈 지점이 자동으로 놓을 지점이 됨. |
| 4 | 놓은 뒤 고치려면 표지를 마우스로 끌어 옮김. 표의 값이 따라 바뀜. |
| 5 | 지도는 빈 곳을 끌어 옮기고 휠로 확대 · 축소함. |
![놓을 지점으로 고른 줄](D02_03_pick_point.webp)
그림 번호 — 1 📍 단추 · 2 강조된 줄(놓을 지점)
![지점을 고르지 않고 지도를 누른 모습](D02_04_map_toast.webp)
그림 번호 — 1 「지도에 놓을 지점 고르기」 안내
## 보이는 것
- 지점이 모두 놓이면 연도마다 다른 색의 선이 지점 사이를 이음. 표지 위에는 지점 이름이 붙음.
- 놓을 지점을 고르지 않고 지도를 누르면 「지도에 놓을 지점 고르기」 안내가 나오고 아무것도 놓이지 않음.
- 지점이 하나도 없으면 우리나라 가운데쯤이 먼저 보임. 처음 한 점을 놓으면 그 점에 맞춰 보이고, 그 뒤로는 사용자가 맞춘 보기(중심 · 확대)를 그대로 둠.
- 지도는 카카오맵을 씀.
- 산림청이 아닌 계정은 지도를 눌러도 놓이지 않고 표지도 끌 수 없음. 지도 위 안내 글이 「보기 전용 — 지점은 산림청만 고칩니다.」로 바뀜.
> 주의: 놓은 지점은 [저장] 이나 [>]를 누르기 전까지 서버에 남지 않음. [단추와 저장](D02/04_단추와_저장) 참고.
@@ -0,0 +1,28 @@
# 좌표 직접 입력
다른 프로그램에서 구한 좌표를 표의 경도 · 위도 칸에 직접 넣는 방법.
## 여는 길
- 왼쪽 「연도 지점」 표의 줄마다 있는 경도 · 위도 두 칸.
## 단계
| 단계 | 할 일 |
| --- | --- |
| 1 | 고칠 줄의 경도 칸에 값을 넣음. |
| 2 | 위도 칸에도 값을 넣고 칸 밖을 누르거나 Tab 키를 누름. |
| 3 | 두 값이 범위 안이면 지점이 옮겨지고 지도 표지가 따라 움직임. |
| 4 | 범위 밖이면 두 칸이 빨갛게 표시되고 반영되지 않음. 값을 고쳐 다시 넣음. |
![범위 밖 값 안내](D02_05_coordinate_error.webp)
그림 번호 — 1 경도 칸(범위 밖 값 200을 넣은 모습) · 2 위도 칸
## 보이는 것
- 경도는 120 ~ 135, 위도는 30 ~ 45 범위만 받음.
- 두 칸이 모두 범위 안일 때 반영됨. 한 칸만 넣으면 반영되지 않음.
- 반영될 때 소수 7 자리(약 1 cm)로 반올림됨.
> 주의: 좌표는 경도 · 위도(WGS84)로 넣음. 평면좌표(X · Y)를 그대로 넣으면 범위 밖으로 처리됨.
@@ -0,0 +1,33 @@
# 단추와 저장
왼쪽 패널 맨 아래 단추 줄 — [?] · [<] · [>] · [저장]과 저장 때 일어나는 일.
## 여는 길
- 기준 지정 화면 왼쪽 패널 맨 아래.
![단추 줄](D02_06_buttons.webp)
그림 번호 — 1 [?] 가이드 · 2 [<] 이전 단계(첫 단계라 흐림) · 3 [>] 다음 단계 · 4 [저장]
## 단계
| 단계 | 할 일 |
| --- | --- |
| 1 | 모든 지점 줄을 채움. |
| 2 | [저장]을 누름. 지점이 서버에 저장되고 「지점을 저장했습니다.」 알림이 뜸. |
| 3 | 바로 다음 단계로 가려면 [저장] 대신 [>]를 누름. 지점을 저장한 뒤 [노선 분석](D03/00_설명서) 화면이 열림. |
| 4 | 저장하지 못하면(예: 빈 지점) 이 화면에 머묾. |
## 보이는 것
- 저장하면 표 아래 한 줄이 「저장 좌표계 EPSG:번호」와 첫 연도 시점의 X · Y(m)로 바뀜.
- 빈 지점이 남은 채 저장하면 「○○○○년 시점이 비었습니다.」 또는 「○○○○년 종점이 비었습니다.」로 막힘.
- 산림청이 아닌 계정은 [저장]이 안 보이고, [>]는 저장 없이 그냥 다음 화면으로 감.
- [>]는 지점 저장 뒤 [노선 분석](D03/00_설명서) 화면을 엶. 수치지형도(도엽) · 위성 사진 · 연도별 지형면 받기는 그 화면이 열릴 때 뒤에서 시작되며, 이미 받은 범위 안이면 건너뜀.
> 주의: 이미 분석 · 확정한 연도의 지점을 옮기면 그 연도의 분석 노선과 확정 상태가 비워지고 다시 분석해야 함. 1 mm 이내 변화는 같은 지점으로 보아 지우지 않음.
> 주의: 좌표계가 바뀌는 경우([쓰인 방법과 근거](D02/20_쓰인_방법과_근거) 참고)에는 모든 연도의 분석 노선이 비워짐.
> 참고: 연도 범위(시작 · 끝)는 등록 때 정해지며 이 화면에서 바꿀 수 없음.
@@ -0,0 +1,27 @@
# 단계 이동 메뉴
☰ 로 진행 단계를 열어 대시보드나 다른 단계 화면으로 옮겨 가는 방법.
## 여는 길
- 화면 왼쪽 위의 ☰ 를 누름.
![진행 단계 메뉴](D02_07_steps_menu.webp)
그림 번호 — 1 진행 단계 목록(대시보드 · 기준 지정 · 노선 분석 · 확정 · 내보내기)
## 단계
| 단계 | 할 일 |
| --- | --- |
| 1 | ☰ 를 누르면 왼쪽에 메뉴가 열림. |
| 2 | 가야 할 단계를 누름. 지금 단계는 강조되어 있음. |
| 3 | 메뉴 밖 어두운 곳을 누르면 닫힘. |
## 보이는 것
- 맨 위 「대시보드」 = 프로젝트 목록 화면으로 돌아감.
- 단계는 기준 지정 → 노선 분석 → 확정 · 내보내기 순.
- 메뉴 아래에는 홈페이지 바로가기 · 언어 · 테마 · 로그아웃이 같이 있음.
> 주의: 지점을 고치고 저장하지 않은 채 다른 단계로 가면 서버에는 저장되지 않음. 먼저 [저장]을 누를 것.
+4
View File
@@ -1,5 +1,9 @@
# 칸 뜻
![연도 지점 표](D02_01_points_table.webp)
그림 번호는 [연도 지점 표](D02/01_연도_지점_표)와 같음.
## 왼쪽 「연도 지점」 표
| 칸 | 뜻 | 규칙 |
| --- | --- | --- |
Binary file not shown.

After

Width:  |  Height:  |  Size: 243 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 40 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 198 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 243 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 162 KiB

+10
View File
@@ -0,0 +1,10 @@
[
{"name":"D02_00_overview","route":"#/d02-plan-base","project":"plan","before":[{"wait":".d02-points__row"},{"wait":".ui-kakao-map__box"},{"wait_ms":3500}],"settle_ms":1500,"clip":null,"callouts":[{"n":1,"sel":".ui-workflow-overlay__header"},{"n":2,"sel":".d02-points"},{"n":3,"sel":".d02-info"},{"n":4,"sel":".d02-map","pos":"tr"},{"n":5,"sel":".ui-sidebar-actions","pos":"tr"}]},
{"name":"D02_01_points_table","route":"#/d02-plan-base","project":"plan","before":[{"wait":".d02-points__row"},{"wait":".ui-kakao-map__box"},{"wait_ms":3500}],"settle_ms":1500,"clip":".d02-panel .ui-sidebar-card","callouts":[{"n":1,"sel":".d02-panel p.d02-info:first-of-type"},{"n":2,"sel":".d02-points__row:nth-child(1)","pos":"tr"},{"n":3,"sel":".d02-points__row:nth-child(1) button","pos":"bl"},{"n":4,"sel":".d02-points__row:nth-child(1) input[data-axis=lon]","pos":"br"},{"n":5,"sel":".d02-points__row:nth-child(1) input[data-axis=lat]","pos":"br"},{"n":6,"sel":".d02-points ~ p.d02-info"}]},
{"name":"D02_02_year_colors","route":"#/d02-plan-base","project":"plan","before":[{"wait":".d02-points__row"},{"wait":".ui-kakao-map__box"},{"wait_ms":3500}],"settle_ms":1500,"clip":".d02-map","callouts":[{"n":1,"sel":".ui-kakao-map__hint"}]},
{"name":"D02_03_pick_point","route":"#/d02-plan-base","project":"plan","before":[{"wait":".d02-points__row"},{"wait":".ui-kakao-map__box"},{"wait_ms":3500},{"click":".d02-points__row:nth-child(2) button"},{"wait":".d02-points__row:nth-child(2).is-active"},{"wait_ms":300}],"settle_ms":1500,"clip":".d02-panel .ui-sidebar-card","callouts":[{"n":1,"sel":".d02-points__row:nth-child(2) button"},{"n":2,"sel":".d02-points__row:nth-child(2)"}]},
{"name":"D02_04_map_toast","route":"#/d02-plan-base","project":"plan","before":[{"wait":".d02-points__row"},{"wait":".ui-kakao-map__box"},{"wait_ms":3500},{"click":".ui-kakao-map__box"},{"wait":".ui-toast, .ui-toast-container, [class*=toast]"},{"wait_ms":400}],"settle_ms":1500,"clip":null,"callouts":[{"n":1,"sel":"[class*=toast]","pos":"tr"}]},
{"name":"D02_05_coordinate_error","route":"#/d02-plan-base","project":"plan","before":[{"wait":".d02-points__row"},{"wait":".ui-kakao-map__box"},{"wait_ms":3500},{"fill":".d02-points__row:nth-child(1) input[data-axis=lon]","value":"200"},{"press":"Tab","sel":".d02-points__row:nth-child(1) input[data-axis=lon]"},{"wait":".d02-points__row:nth-child(1) input.is-invalid"},{"wait_ms":300}],"settle_ms":1500,"clip":".d02-panel .ui-sidebar-card","callouts":[{"n":1,"sel":".d02-points__row:nth-child(1) input[data-axis=lon]"},{"n":2,"sel":".d02-points__row:nth-child(1) input[data-axis=lat]"}]},
{"name":"D02_06_buttons","route":"#/d02-plan-base","project":"plan","before":[{"wait":".d02-points__row"},{"wait":".ui-kakao-map__box"},{"wait_ms":3500}],"settle_ms":1500,"clip":".ui-sidebar-actions","callouts":[{"n":1,"sel":".ui-sidebar-actions > button:nth-child(1)"},{"n":2,"sel":".ui-sidebar-actions > button:nth-child(2)"},{"n":3,"sel":".ui-sidebar-actions > button:nth-child(3)"},{"n":4,"sel":".ui-sidebar-actions > button:nth-child(4)"}]},
{"name":"D02_07_steps_menu","route":"#/d02-plan-base","project":"plan","before":[{"wait":".d02-points__row"},{"click":".app-burger"},{"wait":".app-drawer__steps .ui-workflow-layout__step"},{"wait_ms":700}],"settle_ms":1500,"clip":null,"callouts":[{"n":1,"sel":".app-drawer__steps","pos":"tr"}]}
]