Make ICP interactive · drop GICP · add Transformation · stable cluster colors

ICP (chapter 10, moved to last)
- Replaces the precomputed before/after toggle with a real, in-browser ICP.
- Step button runs one iteration: KdTree nearest-correspondences →
  Procrustes (3×3 SVD via Jacobi eigendecomp of HᵀH) → compose into the
  cumulative transform. Play auto-iterates ~6 fps so you can watch the
  alignment tighten frame by frame.
- max-correspondence-distance slider reproduces PCL's
  setMaxCorrespondenceDistance gate.

Transformation (new chapter 3)
- Six sliders (tx/ty/tz, rx/ry/rz) over a 4×4 rigid transform with
  ZYX-Euler rotation. First load randomizes a small translation so the
  demo is never visually trivial. Code panel mirrors Eigen::Matrix4f.

Euclidean Clustering colors stay stable across slider changes
- ClusterColorMatcher tracks centroids and reuses the prior color for
  the closest matching cluster (within 3× tolerance). New clusters get a
  fresh hue from the golden-angle spiral.

Data picker
- Reordered: Bunny → NaverLabs → KITTI, each with a (CAD)/(Indoor)/
  (Outdoor) chip.

Camera auto-fit
- PointCloudViewer now reframes (camera position + OrbitControls target)
  whenever the union bbox changes — preset switches snap to fit.

Cleanup
- GICP page, route, dictionary entries, precomputed PCDs all removed.
- export_precomputed.cpp + CMake target removed (no longer needed; web
  side does everything live).
- README updated to reflect 10 fully interactive chapters.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Author: LimHyungTae

CMakeLists.txt

@@ -68,11 +68,3 @@ target_link_libraries(lec11_icp ${PCL_LIBRARIES})
 
 add_executable(lec12_gicp lec12_gicp.cpp)
 target_link_libraries(lec12_gicp ${PCL_LIBRARIES})
-
-# ──────────────────────────────────────────────────────────────────────────────
-# Pre-compute pipeline for the React/web tutorial site (web/).
-# Run from the build/ directory after `make export_precomputed`:
-#   ./export_precomputed
-# It dumps src/tgt/aligned PCDs into ../web/public/precomputed/.
-add_executable(export_precomputed scripts/export_precomputed.cpp)
-target_link_libraries(export_precomputed ${PCL_LIBRARIES})

README.md

@@ -28,11 +28,20 @@ ______________________________________________________________________
 
 브라우저에서 슬라이더를 만져 가며 챕터별 동작을 직접 확인할 수 있습니다 — **<https://limhyungtae.github.io/pcl_tutorial/>**.
 
-| 트랙              | 챕터                                  | 어디서 도느냐                                           |
-| ----------------- | ------------------------------------- | ------------------------------------------------------- |
-| **인터랙티브**    | Voxelization, PassThrough             | TypeScript 재구현 → 브라우저에서 실시간                 |
-| **Pre-computed**  | ICP, GICP, Normal Estimation          | C++ 바이너리(`export_precomputed`)가 뽑은 PCD를 fetch  |
-| **코드 설명**     | shared_ptr, Ptr, Transformation 등    | 소스코드 + 블로그 글 링크 (개념 위주)                  |
+모든 인터랙티브 데모는 **TypeScript로 재구현된 알고리즘이 브라우저에서 실시간으로** 돕니다 (외부 컴퓨트 없음). 입력은 KITTI(Outdoor LiDAR) / NaverLabs(Indoor LiDAR) / Stanford Bunny(CAD) 프리셋 + 자유 드래그&드롭.
+
+| #  | 챕터                                  | 핵심                                                |
+| -- | ------------------------------------- | --------------------------------------------------- |
+| 1  | Voxelization                          | leaf size 슬라이더, before/after                    |
+| 2  | PassThrough                           | 축 + min/max + negative 토글                        |
+| 3  | Transformation                        | tx/ty/tz/rx/ry/rz, 진입 시 랜덤 offset              |
+| 4  | Statistical Outlier Removal           | mean K + stddev mult, 인라이어/아웃라이어 분리       |
+| 5  | Radius Search                         | KdTree 기반 반경 내 이웃                             |
+| 6  | K-Nearest Neighbor                    | KdTree 기반 K-NN                                    |
+| 7  | Normal Estimation                     | KdTree + 닫힌형 3×3 sym eig                         |
+| 8  | RANSAC Plane Segmentation             | 지면/벽 검출 (extra)                                |
+| 9  | Euclidean Clustering                  | 색상이 슬라이더 변화에도 안정적으로 유지 (extra)    |
+| 10 | Iterative Closest Point               | **Step / Play 버튼으로 매 iteration 관찰**          |
 
 ### 로컬에서 사이트 띄우기
 
@@ -44,15 +53,6 @@ npm run dev          # http://localhost:5173/pcl_tutorial/
 
 `predev` / `prebuild` 훅이 `materials/`의 데이터(`.bin` / `.pcd` / `.ply`)를 자동으로 `web/public/data/`로 복사합니다.
 
-### Pre-computed 자산 다시 뽑기 (선택)
-
-`lec11_icp.cpp` / `lec12_gicp.cpp`의 출력은 미리 PCD로 저장돼 `web/public/precomputed/`에 들어 있습니다. 알고리즘이나 입력을 바꿨다면 다시 뽑아주세요:
-
-```bash
-cd build && make export_precomputed
-KMP_DUPLICATE_LIB_OK=TRUE ./export_precomputed     # macOS Homebrew PCL은 이 플래그 필요
-```
-
 ### 배포
 
 `main` 브랜치에 `web/**` 변경이 push되면 GitHub Actions(`.github/workflows/deploy.yml`)가 자동으로 빌드 후 GitHub Pages에 배포합니다. 첫 배포 전에는 GitHub repo settings → Pages → Source를 **GitHub Actions**로 설정해 주세요.
@@ -118,17 +118,19 @@ ______________________________________________________________________
 pcl_tutorial/
 ├── CMakeLists.txt
 ├── lec*.cpp                         # 챕터별 예제 코드 (PCL/C++)
-├── scripts/
-│   └── export_precomputed.cpp       # ICP/GICP 결과를 PCD로 저장 (web/이 사용)
 ├── auxiliary/                       # 본 빌드와 무관한 보조 스니펫
 ├── img/                             # README/블로그용 이미지
 ├── materials/                       # 예제용 포인트클라우드 데이터 (.bin / .pcd / .ply)
 └── web/                             # React + Vite 기반 인터랙티브 사이트
     ├── src/
     │   ├── pages/                   # 챕터별 페이지
     │   ├── components/              # 뷰어, 슬라이더, 드롭존
-    │   └── lib/filters/             # voxel, passthrough, … (TS 재구현)
-    └── public/precomputed/          # C++가 미리 뽑은 .pcd (커밋됨)
+    │   ├── i18n/                    # 영/한 사전 + 토글
+    │   └── lib/                     # KdTree, PCD/BIN/PLY 파서,
+    │       └── filters/             # voxel · passthrough · sor · normal ·
+    │                                #   ransacPlane · euclideanCluster · icp ·
+    │                                #   transform (모두 TS 재구현)
+    └── public/data/                 # materials/에서 자동 복사 (build 시)
 ```
 
 ______________________________________________________________________

scripts/export_precomputed.cpp

@@ -29,59 +29,59 @@ export const chapters: ChapterMeta[] = [
     status: "interactive",
   },
   {
-    slug: "lec07",
+    slug: "lec03",
     number: "3",
+    source: "lec03_transformation.cpp",
+    blog: `${BLOG}/2021-09-10-ROS-Point-Cloud-Library-(PCL)-3.-Transformation/`,
+    status: "interactive",
+  },
+  {
+    slug: "lec07",
+    number: "4",
     source: "lec07_sor.cpp",
     blog: `${BLOG}/2021-09-12-ROS-Point-Cloud-Library-(PCL)-7.-Statistical-Outlier-Removal/`,
     status: "interactive",
   },
   {
     slug: "lec08",
-    number: "4",
+    number: "5",
     source: "lec08_radius_search.cpp",
     blog: `${BLOG}/2021-09-12-ROS-Point-Cloud-Library-(PCL)-8.-KdTree를-활용한-Radius-Search/`,
     status: "interactive",
   },
   {
     slug: "lec09",
-    number: "5",
+    number: "6",
     source: "lec09_knn.cpp",
     blog: `${BLOG}/2021-09-12-ROS-Point-Cloud-Library-(PCL)-9.-KdTree를-활용한-K-nearest-Neighbor-Search-(KNN)/`,
     status: "interactive",
   },
   {
     slug: "lec10",
-    number: "6",
+    number: "7",
     source: "lec10_1_normal.cpp",
     blog: `${BLOG}/2021-09-13-ROS-Point-Cloud-Library-(PCL)-10.-Normal-Estimation/`,
     status: "interactive",
   },
   {
-    slug: "lec11",
-    number: "7",
-    source: "lec11_icp.cpp",
-    blog: `${BLOG}/2021-09-14-ROS-Point-Cloud-Library-(PCL)-11.-Iterative-Closest-Point-(ICP)/`,
-    status: "precomputed",
-  },
-  {
-    slug: "lec12",
+    slug: "extra01",
     number: "8",
-    source: "lec12_gicp.cpp",
-    blog: `${BLOG}/2021-09-14-ROS-Point-Cloud-Library-(PCL)-12.-Generalized-Iterative-Closest-Point-(G-ICP)/`,
-    status: "precomputed",
+    source: "",
+    blog: "",
+    status: "interactive",
   },
   {
-    slug: "extra01",
+    slug: "extra02",
     number: "9",
     source: "",
     blog: "",
     status: "interactive",
   },
   {
-    slug: "extra02",
+    slug: "lec11",
     number: "10",
-    source: "",
-    blog: "",
+    source: "lec11_icp.cpp",
+    blog: `${BLOG}/2021-09-14-ROS-Point-Cloud-Library-(PCL)-11.-Iterative-Closest-Point-(ICP)/`,
     status: "interactive",
   },
 ];