goldenChat base source add

how_to_use_toolbar.md

@@ -0,0 +1,622 @@
+# goldenChart 차트 툴바 사용법
+
+## 범례
+
+| 기호 | 의미 |
+|------|------|
+| ✅ | 완전 구현 — 독립 렌더러 |
+| 🔗 | 별칭 동작 — 다른 툴과 같은 렌더링 |
+| 🚧 | 준비 중 — UI 선택은 가능하지만 드로잉이 생성되지 않음 |
+
+---
+
+## 1. 툴바 구조
+
+좌측에 수직으로 배치된 툴바는 다음과 같이 구성됩니다.
+
+```
+[ 커서 ]          ← 항상 고정
+[ 라인 그룹 ]
+[ 피보나치 그룹 ]
+[ 패턴 그룹 ]
+[ 프로젝션 그룹 ]
+[ 도형 그룹 ]
+[ 브러시 그룹 ]
+[ 텍스트 & 노트 그룹 ]
+[ 측정 그룹 ]
+[ 확대/축소 그룹 ]
+────────────────
+[ 자석 ]          ← 하단 고정 버튼
+[ 잠금 ]
+[ 눈/가시성 ]
+[ 되돌리기 ]
+[ 삭제 ]
+[ 레이어 ]
+```
+
+### 플라이아웃 메뉴 사용 방법
+
+- **호버(마우스 올리기)** — 약 200ms 후 해당 그룹의 하위 툴 목록이 오른쪽으로 펼쳐집니다.
+- **클릭** — 즉시 플라이아웃을 열거나, 마지막으로 선택한 툴을 바로 활성화합니다.
+- **툴 선택** — 플라이아웃 내 항목을 클릭하면 해당 툴이 활성화되고, 그룹 버튼 아이콘이 선택한 툴 아이콘으로 변경됩니다.
+- **플라이아웃 닫기** — 메뉴에서 마우스를 벗어나면 약 300ms 후 자동으로 닫힙니다.
+
+> **주의**: 드로잉 모드는 **차트 뷰(Trading View)** 모드일 때만 활성화됩니다. 기본 차트 모드에서는 모든 툴이 비활성(dim) 상태입니다.
+
+---
+
+## 2. 커서 (Cursor)
+
+| 툴 | 단축키 | 상태 |
+|----|--------|------|
+| 커서 | — | ✅ |
+
+기본 탐색 모드입니다. 드로잉 생성 없이 차트를 스크롤·줌·패닝합니다.
+이미 생성된 드로잉을 클릭하면 선택되며, 앵커 포인트(흰 원)가 표시됩니다.
+
+---
+
+## 3. 라인 그룹
+
+| 툴 | 한국어 | 점 수 | 사용법 | 상태 |
+|----|--------|-------|--------|------|
+| `trendline` | 추세줄 | 2 | 클릭 → 두 번째 클릭 | ✅ |
+| `ray` | 빛 | 2 | 클릭 → 두 번째 클릭 | ✅ |
+| `info_line` | 인포 라인 | 1 | 클릭 한 번 | ✅ |
+| `extended_line` | 익스텐디드 라인 | 2 | 클릭 → 두 번째 클릭 | 🔗 trendline |
+| `trend_angle` | 추세각 | 2 | 클릭 → 두 번째 클릭 | ✅ |
+| `hline` | 가로줄 | 1 | 클릭 한 번 | ✅ |
+| `hline_ray` | 가로빛 | 1 | 클릭 한 번 | ✅ |
+| `vline` | 수직선 | 1 | 클릭 한 번 | ✅ |
+| `cross_line` | 크로스 라인 | 1 | 클릭 한 번 | ✅ |
+| `channel` | 추세 채널 | 2 | 클릭 → 두 번째 클릭 | ✅ |
+| `parallel_channel` | 패러렐 채널 | 3 | 1클릭 → 2클릭 → 3클릭 | ✅ |
+| `disjoint_channel` | 디스조인트 채널 | 2 | 클릭 → 두 번째 클릭 | 🔗 channel |
+| `flat_top_bottom` | 플랫 탑/바텀 | 2 | 클릭 → 두 번째 클릭 | 🔗 rect |
+
+### 각 툴 동작 상세
+
+#### 추세줄 `trendline` ✅
+두 점을 클릭하면 양방향으로 무한 연장되는 추세선을 그립니다.
+초록색 선, 두 앵커 포인트 표시.
+
+#### 빛 `ray` ✅
+첫 번째 점에서 시작하여 두 번째 점 방향으로 오른쪽 끝까지 연장됩니다.
+단방향 확장선(반직선).
+
+#### 인포 라인 `info_line` ✅
+클릭한 가격 위치에 수평선을 그리고, 우측 끝에 **현재 가격 라벨 박스**를 표시합니다.
+가격이 1,000 이상이면 세 자리 단위 콤마 형식(예: `95,430`), 소액은 소수점 4자리로 표시.
+
+#### 익스텐디드 라인 `extended_line` 🔗 trendline
+추세줄과 동일하게 양방향 연장선을 그립니다.
+
+#### 추세각 `trend_angle` ✅
+두 점을 잇는 선을 그리고, 첫 번째 점에 **원호(arc)와 각도(°)** 를 표시합니다.
+예: 수평 대비 기울기 각도 표시.
+
+#### 가로줄 `hline` ✅  (단축키: `⌥H`)
+클릭한 가격 레벨에 차트 전체 폭의 수평선을 그립니다.
+우측에 작은 가격 라벨 표시.
+
+#### 가로빛 `hline_ray` ✅  (단축키: `⌥J`)
+클릭한 시점(x축)에서 시작하여 오른쪽으로만 연장되는 수평선입니다.
+시작점에 작은 원 앵커 표시.
+
+#### 수직선 `vline` ✅  (단축키: `⌥V`)
+클릭한 시점(x축)에 차트 전체 높이의 수직선을 그립니다.
+
+#### 크로스 라인 `cross_line` ✅  (단축키: `⌥C`)
+클릭한 점을 교차점으로 **수평선 + 수직선** 을 동시에 그립니다.
+가격과 시간 기준선을 한 번에 설정할 때 유용합니다.
+
+#### 추세 채널 `channel` ✅
+두 점으로 메인 라인(실선)을 그리고, 메인 라인에 평행한 보조 라인(파선)을 표시합니다.
+두 선 사이 영역은 반투명 색으로 채워집니다.
+
+#### 패러렐 채널 `parallel_channel` ✅ (**3점 도구**)
+1. **1클릭**: 방향선 시작점
+2. **2클릭**: 방향선 끝점 (채널 기울기 결정)
+3. **3클릭**: 채널 폭 결정 (클릭 위치가 두 번째 평행선 위치)
+
+세 번의 클릭으로 기울어진 채널의 방향과 폭을 자유롭게 설정할 수 있습니다.
+
+#### 디스조인트 채널 `disjoint_channel` 🔗 channel
+채널과 동일하게 동작합니다.
+
+#### 플랫 탑/바텀 `flat_top_bottom` 🔗 rect
+사각형과 동일하게 동작합니다.
+
+---
+
+## 4. 피보나치 그룹
+
+| 툴 | 한국어 | 점 수 | 상태 |
+|----|--------|-------|------|
+| `fib` | 피보나치 되돌림 | 2 | ✅ |
+| `fib_ext` | 추세기반 피보나치 확장 | 2 | ✅ |
+| `fib_channel` | 피보나치 채널 | 2 | ✅ |
+| `fibtz` | 피보나치 타임존 | 2 | ✅ |
+| `fib_speed_fan` | 스피드 리지스턴스 팬 | 2 | ✅ |
+| `fib_trend_time` | 추세기반 피보나치 시간 | 2 | 🔗 fib |
+| `fib_circles` | 피보나치 서클 | 2 | 🔗 fib |
+| `fib_spiral` | 피보나치 스파이럴 | 2 | 🔗 fib |
+| `fib_speed_arc` | 스피드 리지스턴스 아크 | 2 | 🔗 fib |
+| `fib_wedge` | 피보나치 웻지 | 2 | 🔗 fib |
+| `pitchfork` | 앤드류스 피치포크 | 3 | ✅ |
+| `pitchfork_schiff` | 쉬프 피치포크 | 3 | ✅ |
+| `pitchfork_inside` | 인사이드 피치포크 | 3 | ✅ |
+| `gann_box` | 갠 박스 | 2 | ✅ |
+| `gann_square` | 갠 스퀘어 | 2 | ✅ |
+| `gann_fan` | 갠 팬 | 2 | ✅ |
+
+### 각 툴 동작 상세
+
+#### 피보나치 되돌림 `fib` ✅  (단축키: `⌥F`)
+두 점(고점 → 저점 또는 저점 → 고점)을 클릭합니다.
+수평 레벨 선: **0%, 23.6%, 38.2%, 50%, 61.8%, 78.6%, 100%, 127.2%, 161.8%**
+각 레벨마다 퍼센트와 가격을 표시합니다.
+
+#### 추세기반 피보나치 확장 `fib_ext` ✅
+두 점을 클릭하면 두 번째 점에서 **확장** 방향으로 레벨이 표시됩니다.
+레벨: **0%, 23.6%, 38.2%, 61.8%, 78.6%, 100%, 127.2%, 161.8%, 200%, 261.8%**
+100% 이상의 확장 레벨이 주목적이며 목표가 설정에 활용됩니다.
+
+#### 피보나치 채널 `fib_channel` ✅
+두 점으로 기준 대각선을 설정하면, 기준선에 **평행한** 여러 채널 라인이 피보나치 비율 간격으로 표시됩니다.
+채널 레벨: 0%, 23.6%, 38.2%, 50%, 61.8%, 78.6%, 100%, 161.8%
+
+#### 피보나치 타임존 `fibtz` ✅
+두 점 사이의 시간 간격을 1단위로 하여 피보나치 수열(1, 2, 3, 5, 8, 13, 21...)에 해당하는 시점에 수직선을 그립니다.
+향후 중요 시점 예측에 사용됩니다.
+
+#### 스피드 리지스턴스 팬 `fib_speed_fan` ✅
+시작점에서 끝점 방향으로 피보나치 비율(25%, 33%, 50%, 62%, 100%)에 해당하는 각도의 팬 라인을 그립니다.
+지지/저항 각도선 분석에 사용됩니다.
+
+#### 앤드류스 피치포크 `pitchfork` ✅ (**3점 도구**)
+1. **1클릭**: 시작 피벗 포인트 (P0)
+2. **2클릭**: 상단 포인트 (P1)
+3. **3클릭**: 하단 포인트 (P2)
+
+P1과 P2의 중간점을 향해 중심선(핸들)이 그려지고, 중심선과 평행한 좌우 포크 라인이 연장됩니다.
+추세의 균형점과 가격 채널 분석에 활용됩니다.
+
+#### 쉬프 피치포크 `pitchfork_schiff` ✅ (**3점 도구**)
+앤드류스 피치포크의 변형으로, **핸들 시작점이 P0과 P1의 중간점**에서 시작됩니다.
+표준 피치포크보다 완만한 각도로 기울어집니다.
+
+#### 인사이드 피치포크 `pitchfork_inside` ✅ (**3점 도구**)
+핸들이 **중간점(P0,P1) → 중간점(P1,P2)** 를 연결합니다.
+내부 채널 분석에 특화된 변형입니다.
+
+#### 갠 박스 `gann_box` ✅
+두 점으로 사각형을 그리고 내부에 **대각선 2개, 수직·수평 중심선, 1/4 분할선**을 표시합니다.
+가격과 시간의 균형 분석에 사용됩니다.
+
+#### 갠 스퀘어 `gann_square` ✅
+첫 번째 점 기준으로 **정사각형**을 강제 적용하고, 내부에 갠 각도 분할선을 표시합니다.
+1/8 단위 대각선 분할로 가격-시간 균형점을 분석합니다.
+
+#### 갠 팬 `gann_fan` ✅
+두 점(피벗 → 기준점)을 클릭하면, 피벗에서 **9가지 비율의 팬 라인**을 그립니다.
+
+| 라인 | 비율 | 색상 |
+|------|------|------|
+| 8:1 | 매우 가파름 | 빨강 |
+| 4:1 | 가파름 | 주황 |
+| 3:1 | 급경사 | 노랑 |
+| 2:1 | 경사 | 연두 |
+| **1:1** | **45도 균형선** | **흰색** |
+| 1:2 | 완만 | 연두 |
+| 1:3 | 완만 | 노랑 |
+| 1:4 | 매우 완만 | 주황 |
+| 1:8 | 수평에 가까움 | 빨강 |
+
+---
+
+## 5. 패턴 그룹
+
+> 모든 패턴 툴은 **지그재그 연결선 + 포인트 레이블** 방식으로 구현되어 있습니다.  
+> 필요한 점 수만큼 클릭하면 패턴이 완성됩니다.  
+> 그리는 도중에는 현재까지의 지그재그 선이 미리보기로 표시됩니다.
+
+| 툴 | 한국어 | 필요 점 수 | 레이블 | 상태 |
+|----|--------|-----------|--------|------|
+| `xabcd` | XABCD 패턴 | 5 | X→A→B→C→D | ✅ |
+| `cypher` | 사이퍼 패턴 | 5 | X→A→B→C→D | ✅ |
+| `head_shoulders` | 헤드 앤 숄더 | 7 | L→LS→H→RS→R + 넥라인 | ✅ |
+| `abcd` | ABCD 패턴 | 4 | A→B→C→D | ✅ |
+| `wedge_pattern` | 세모 패턴 | 5 | 1→2→3→4→5 | ✅ |
+| `three_drives` | 쓰리 드라이브 패턴 | 6 | O→A→1→B→2→C | ✅ |
+| `elliott_impulse` | 엘리엇 임펄스 파동 | 6 | 0→1→2→3→4→5 | ✅ |
+| `elliott_correction` | 엘리엇 코렉션 파동 | 4 | 0→A→B→C | ✅ |
+| `elliott_triangle_wave` | 엘리엇 트라이앵글 웨이브 | 6 | 0→A→B→C→D→E | ✅ |
+| `elliott_double_combo` | 엘리엇 다블콤보 파동 | 4 | 0→W→X→Y | ✅ |
+
+### 사용 방법 (공통)
+
+1. 패턴 툴을 선택합니다.
+2. 차트에서 해당 패턴의 각 극점(고점/저점)을 순서대로 클릭합니다.
+3. 마지막 점을 클릭하면 패턴이 확정됩니다.
+4. 각 포인트에 레이블(X, A, B, C, D 등)이 표시됩니다.
+
+> **헤드 앤 숄더**: 처음 5점(L, LS, H, RS, R)이 패턴 본체이고, 나머지 2점(NL1, NL2)으로 넥라인을 파선으로 그립니다.
+
+---
+
+## 6. 프로젝션 그룹
+
+| 툴 | 한국어 | 점 수 | 상태 |
+|----|--------|-------|------|
+| `long_position` | 매수 포지션 | 2 | ✅ |
+| `short_position` | 숏 포지션 | 2 | ✅ |
+| `forecast` | 예측 | 2 | ✅ |
+| `bar_pattern` | 봉패턴 | 2 | ✅ |
+| `ghost_feed` | 고스트피드 | 2 | ✅ |
+| `projection_tool` | 프로젝션 | 2 | 🔗 trendline |
+| `anchored_vwap` | 앵커드 VWAP | 1 | ✅ |
+| `fixed_volume_profile` | 픽스트 레인지 볼륨 프로파일 | 2 | ✅ |
+| `price_range` | 가격범위 | 2 | 🔗 measure |
+| `date_range` | 날짜 범위 | 2 | ✅ |
+| `date_price_range` | 날짜&가격 범위 | 2 | ✅ |
+
+### 각 툴 동작 상세
+
+#### 매수 포지션 `long_position` ✅
+두 점(진입가 → 목표가)을 클릭합니다.
+
+- **진입선(회색)**: 1클릭 가격
+- **목표선(초록 파선)**: 2클릭 가격 — 수익 구간(초록 반투명)
+- **손절선(빨강 파선)**: 진입가에서 목표까지 거리의 1/3을 반대 방향으로 자동 계산
+- 우측에 **목표 / 진입 / 손절** 라벨 표시
+
+#### 숏 포지션 `short_position` ✅
+매수 포지션과 동일하지만 방향이 반전됩니다.
+
+- **진입선(회색)**: 1클릭 가격
+- **목표선(빨강 파선)**: 하방 목표 — 수익 구간(빨강 반투명)
+- **손절선(초록 파선)**: 상방 자동 계산
+
+#### 예측 `forecast` ✅
+두 점(현재 → 예상 가격)을 클릭하면 **방향성 색상 박스**를 그립니다.
+
+- **상승 예측**: 초록 반투명 박스, 초록 점선 테두리, `▲ X.XX%` 표시
+- **하락 예측**: 빨강 반투명 박스, 빨강 점선 테두리, `▼ X.XX%` 표시
+- 진입 기준선(회색 실선) 표시
+
+#### 날짜 범위 `date_range` ✅
+두 점을 클릭하면 그 사이 시간을 **수직 밴드**로 강조합니다.
+
+- 좌우에 수직선 표시
+- 상단에 기간 표시 (예: `15일 3시간` 또는 `6시간`)
+- 특정 기간의 가격 변동 분석에 유용
+
+---
+
+## 7. 도형 그룹
+
+| 툴 | 한국어 | 점 수 | 상태 |
+|----|--------|-------|------|
+| `rect` | 네모 | 2 | ✅ |
+| `rotated_rect` | 회전 사각형 | 3 | ✅ |
+| `circle` | 원 | 2 | ✅ |
+| `ellipse` | 타원 | 2 | ✅ |
+| `triangle` | 삼각형 | 3 | ✅ |
+| `parallelogram` | 평행사변형 | 3 | ✅ |
+| `polyline` | 다각형 | N(더블클릭) | ✅ |
+| `arc` | 호 | 3 | ✅ |
+
+### 각 툴 동작 상세
+
+#### 네모 `rect` ✅  (단축키: `⌥⇧R`)
+두 점(대각선 방향)을 클릭하면 사각형을 그립니다.
+반투명 배경색 + 테두리로 영역을 강조합니다.
+
+#### 원 `circle` ✅
+첫 번째 클릭: 원의 중심점  
+두 번째 클릭: 원의 반지름 결정 (중심에서 거리가 반지름)
+
+#### 타원 `ellipse` ✅
+첫 번째 클릭: 타원의 중심점  
+두 번째 클릭: 타원의 경계 설정  
+`rx = |x2 - x1|`, `ry = |y2 - y1|` — x/y 반경을 독립적으로 설정합니다.
+
+#### 삼각형 `triangle` ✅ (**3점 도구**)
+세 번의 클릭으로 임의의 삼각형을 그립니다.
+반투명 배경색 + 테두리 표시.
+
+#### 호 `arc` ✅ (**3점 도구**)
+세 점을 지나는 **원호(arc)** 를 그립니다.
+
+1. **1클릭**: 호의 시작점
+2. **2클릭**: 호의 중간점 (곡률 결정)
+3. **3클릭**: 호의 끝점
+
+세 점이 직선이면 꺾인 선으로 대체됩니다.
+
+---
+
+## 8. 브러시 그룹
+
+| 툴 | 한국어 | 입력 방식 | 상태 |
+|----|--------|-----------|------|
+| `pencil` | 붓 | 드래그 | ✅ |
+| `highlight` | 하이라이터 | 드래그 | ✅ |
+| `arrow_mark` | 화살표 | 2점 | ✅ |
+| `anchored_arrow` | 앵커드 화살표 | 2점 | ✅ |
+| `arrow_mark_up` | 위화살표 | 1점 | ✅ |
+| `arrow_mark_down` | 아래화살표 | 1점 | ✅ |
+| `arrow_mark_left` | 왼화살표 | 1점 | ✅ |
+| `arrow_mark_right` | 오른화살표 | 1점 | ✅ |
+| `rect` | 네모 | 2점 | ✅ |
+| `circle` | 원 | 2점 | ✅ |
+| `triangle` | 삼각형 | 3점 | ✅ |
+| `ellipse` | 타원 | 2점 | ✅ |
+
+### 각 툴 동작 상세
+
+#### 붓 `pencil` ✅
+마우스 버튼을 **누른 상태로 드래그**하면 자유 곡선을 그립니다.
+버튼을 놓으면 경로를 샘플링하여 드로잉으로 저장합니다.
+
+#### 하이라이터 `highlight` ✅
+붓과 동일한 드래그 방식이지만, 두꺼운(12px) 반투명(35%) 노란색으로 그려집니다.
+차트의 특정 구간을 형광펜으로 강조하는 효과.
+
+#### 방향 화살표 `arrow_mark_up/down/left/right` ✅
+클릭 한 번으로 해당 방향의 화살표 마크를 삽입합니다.
+특정 캔들의 매수/매도 포인트, 지지/저항 표시에 활용됩니다.
+
+---
+
+## 9. 텍스트 & 노트 그룹
+
+| 툴 | 한국어 | 점 수 | 상태 |
+|----|--------|-------|------|
+| `text` | 텍스트 | 1 | ✅ |
+| `fixed_text` | 고정위치문자 | 1 | ✅ |
+| `note_text` | 노트 | 1 | ✅ |
+| `price_note` | 프라이스 노트 | 1 | ✅ |
+| `pin_mark` | 핀 | 1 | ✅ |
+| `table_tool` | 테이블 | 1 | 🔗 text |
+| `callout` | 콜아웃 | 1 | ✅ |
+| `comment_mark` | 코멘트 | 1 | ✅ |
+| `price_label` | 가격라벨 | 1 | ✅ |
+| `guide_line` | 길잡이 | 1 | ✅ |
+| `flag_mark` | 플래그 마크 | 1 | ✅ |
+
+### 각 툴 동작 상세
+
+#### 텍스트 `text` ✅  (단축키: `T`)
+클릭 시 텍스트 입력창이 열립니다.
+텍스트를 입력하고 **Enter** 또는 **✓ 버튼**을 누르면 해당 위치에 텍스트를 삽입합니다.
+**Escape**를 누르면 취소합니다.
+
+#### 콜아웃 `callout` ✅
+텍스트와 동일하게 클릭 → 텍스트 입력 방식이며,
+입력한 텍스트가 **말풍선(Speech Bubble)** 형태로 표시됩니다.
+꼬리 부분이 클릭한 차트 위치를 가리킵니다.
+
+#### 핀 `pin_mark` ✅
+클릭 한 번으로 해당 위치에 **핀/압정 모양**의 마커를 삽입합니다.
+원형 머리 + 줄기 + 작은 흰 점으로 구성됩니다.
+
+#### 플래그 마크 `flag_mark` ✅
+클릭 한 번으로 **깃발 모양** 마커를 삽입합니다.
+깃대(수직선) + 삼각형 깃발로 구성됩니다.
+중요 이벤트나 매수/매도 포인트 표시에 활용됩니다.
+
+#### 길잡이 `guide_line` ✅
+클릭한 가격 위치에 **파선(dashed)** 형식의 반투명 수평 안내선을 그립니다.
+목표가, 지지선, 저항선 설정 시 일반 수평선보다 시각적으로 덜 강조됩니다.
+
+#### 고정위치문자 `fixed_text` ✅
+클릭 후 텍스트 입력 → 위치 앵커 원(십자)과 함께 텍스트 표시.
+
+#### 노트 `note_text` ✅
+클릭 후 텍스트 입력 → 노트패드 스타일 노란 박스에 줄선과 함께 텍스트 표시.
+
+#### 프라이스 노트 `price_note` ✅
+클릭 후 텍스트 입력 → 텍스트 박스 + 우측으로 가격 수준선(점선) 연결.
+
+#### 코멘트 `comment_mark` ✅
+클릭 후 텍스트 입력 → 원형 말풍선(꼬리 아래 방향)에 텍스트 표시. callout의 삼각 말풍선과 구별.
+
+#### 가격라벨 `price_label` ✅
+클릭 후 텍스트 입력 → 우측 가격축에 화살표형 라벨 표시 + 수평 점선 연결.
+
+#### 테이블 별칭 도구 🔗
+`table_tool` 현재는 `text`와 동일하게 단순 텍스트로 렌더링됩니다.
+
+---
+
+## 10. 측정 그룹
+
+| 툴 | 한국어 | 점 수 | 상태 |
+|----|--------|-------|------|
+| `measure` | 가격 측정 | 2 | ✅ |
+| `date_range` | 날짜 범위 | 2 | ✅ |
+| `date_price_range` | 날짜&가격 범위 | 2 | ✅ |
+| `data_window` | 데이터 창 | 1 | ✅ |
+
+### 각 툴 동작 상세
+
+#### 가격 측정 `measure` ✅  (단축키: `M`)
+두 점을 클릭하면 사각형 박스와 함께 다음을 표시합니다.
+
+- 가격 변화량 및 변화율 (%)
+- 기간 (캔들 수 또는 일수)
+
+가격 움직임의 크기를 정량적으로 측정합니다.
+
+#### 날짜 범위 `date_range` ✅
+두 점을 클릭하면 해당 시간 구간을 수직 밴드로 강조하고 기간을 표시합니다.
+([프로젝션 그룹](#6-프로젝션-그룹)의 날짜 범위와 동일)
+
+---
+
+## 11. 확대/축소 그룹
+
+| 툴 | 한국어 | 입력 방식 | 상태 |
+|----|--------|-----------|------|
+| `zoom` | 확대/축소 | 드래그 | ✅ |
+| `magnifier` | 돋보기 | 2점 | ✅ |
+
+#### 확대/축소 `zoom` ✅
+마우스 버튼을 **누른 상태로 가로 드래그**하면 드래그한 구간으로 차트가 확대됩니다.
+확대 후 마우스 휠로 추가 조절이 가능합니다.
+
+---
+
+## 12. 하단 고정 버튼
+
+툴바 하단에는 드로잉 관리를 위한 고정 버튼들이 있습니다.
+
+### 자석 (Magnet)
+
+자석 버튼을 클릭하면 플라이아웃이 열립니다.
+
+| 옵션 | 설명 |
+|------|------|
+| **자석 끄기** | 스냅 기능 없음 (기본값) |
+| **약한 자석** | 가까운 캔들 고점/저점/종가에 약하게 스냅 |
+| **강한 자석** | 더 넓은 범위에서 강하게 스냅 |
+| **지표에 스냅** (토글) | 보조지표 값에도 스냅 여부 설정 |
+
+현재 자석 상태는 아이콘으로 구분됩니다:
+- **끄기**: 아이콘 dim
+- **약한 자석**: 아이콘 활성화
+- **강한 자석**: 아이콘 활성화 + 내부 점선 추가
+
+### 잠금 (Lock)
+
+클릭 시 모든 드로잉이 잠금/잠금 해제됩니다.
+**잠금 상태**: 드로잉 선택 및 이동 불가, 새 드로잉 추가만 가능.
+
+### 눈/가시성 (Eye)
+
+클릭하면 플라이아웃이 열립니다.
+
+| 옵션 | 설명 |
+|------|------|
+| **드로잉 숨기기** | 모든 그린 드로잉 숨김 |
+| **지표 숨기기** | 보조지표 숨김 |
+| **전체 숨기기** | 드로잉 + 지표 모두 숨김 |
+
+아이콘 상태:
+- **전체 보임**: 눈 열린 아이콘
+- **부분 숨김**: 눈에 부분 오버레이 (`tv-side-eye-partial` 클래스 적용)
+- **전체 숨김**: 눈 닫힌 아이콘(`IcEyeOff`)
+
+### 되돌리기 (Undo)
+
+클릭 시 마지막으로 추가한 드로잉을 제거합니다.
+
+### 삭제 (Trash)
+
+클릭하면 플라이아웃이 열립니다.
+
+| 옵션 | 설명 |
+|------|------|
+| **드로잉 삭제** (`N`개) | 현재 캔버스의 모든 드로잉 삭제 |
+| **지표 삭제** (`N`개) | 현재 활성화된 보조지표 모두 삭제 |
+| **전체 삭제** (`N`개) | 드로잉 + 지표 모두 삭제 |
+| **잠긴 드로잉 유지** (토글) | ON 시 잠긴 드로잉은 삭제에서 제외 |
+
+### 레이어 (Layers)
+
+오브젝트 트리(Object Tree) 패널을 열어 현재 캔버스의 드로잉 목록을 확인하고 관리합니다.
+
+---
+
+## 13. 드로잉 공통 조작
+
+### 드로잉 선택 및 이동
+
+1. `커서` 모드로 전환
+2. 드로잉 위에서 클릭 → 선택됨 (흰 앵커 포인트 표시)
+3. 선택된 드로잉을 드래그하여 위치 이동
+
+### 드로잉 삭제
+
+선택 후 **Delete** 또는 **Backspace** 키를 누릅니다.
+
+### 텍스트 입력 완료/취소
+
+| 액션 | 키 |
+|------|-----|
+| 확정 | `Enter` 또는 확인 버튼 클릭 |
+| 취소 | `Escape` |
+
+---
+
+## 14. 단축키 요약
+
+| 단축키 | 툴 |
+|--------|-----|
+| `T` | 텍스트 |
+| `M` | 가격 측정 |
+| `⌥T` | 추세줄 (trendline) |
+| `⌥H` | 가로줄 (hline) |
+| `⌥J` | 가로빛 (hline_ray) |
+| `⌥V` | 수직선 (vline) |
+| `⌥C` | 크로스 라인 (cross_line) |
+| `⌥F` | 피보나치 되돌림 (fib) |
+| `⌥⇧R` | 네모 (rect) |
+| `Delete` / `Backspace` | 선택된 드로잉 삭제 |
+
+---
+
+## 15. 구현 상태 전체 요약
+
+### ✅ 완전 구현 (61개)
+
+```
+cursor, trendline, ray, arrow, trend_angle, cross_line,
+hline, hline_ray, vline, info_line, guide_line,
+channel, parallel_channel,
+fib, fib_ext, fib_channel, fib_speed_fan, fib_circles, fib_spiral, fib_speed_arc, fibtz,
+pitchfork, pitchfork_schiff, pitchfork_inside,
+gann_fan, gann_box, gann_square,
+measure, date_range, forecast,
+long_position, short_position,
+bar_pattern, ghost_feed, anchored_vwap, fixed_volume_profile,
+rect, circle, ellipse, triangle, arc,
+pencil, highlight,
+arrow_mark_up, arrow_mark_down, arrow_mark_left, arrow_mark_right,
+text, callout, pin_mark, flag_mark,
+xabcd, cypher, abcd, head_shoulders, wedge_pattern, three_drives,
+elliott_impulse, elliott_correction, elliott_triangle_wave, elliott_double_combo
+```
+
+### 🔗 별칭으로 동작 (24개)
+
+```
+extended_line → trendline
+disjoint_channel → channel
+flat_top_bottom → rect
+fib_trend_time → fib
+fib_circles → fib
+fib_spiral → fib
+fib_speed_arc → fib
+fib_wedge → fib
+table_tool → text
+arrow_mark → arrow (화살촉 있는 선)
+anchored_arrow → arrow (화살촉 있는 선)
+highlight → pencil (외형만 다름)
+price_range → measure
+
+projection_tool → trendline
+anchored_vwap → hline (stub에도 포함, 드로잉 생성 안됨)
+```
+
+### 🚧 준비 중 (5개)
+
+```
+(현재 모든 툴 구현 완료)
+```
+
+---
+
+*최종 업데이트: 2026-05-20*