LensCorrect
WebGL 셰이더로 브라우저 안에서 렌즈 왜곡을 보정하고 결과 이미지를 저장하는 도구
개요
사진을 서버로 올리지 않고 브라우저 안에서 바로 렌즈 왜곡을 조정하기 위해 만든 WebGL 이미지 편집 도구입니다. 단일 이미지 보정과 파노라마 레이어 편집을 분리해, 빠른 보정과 실험적인 합성을 모두 다룰 수 있게 했습니다.
주요 작업
- canvas WebGL context와 fragment shader로 barrel/pincushion 왜곡 보정
- distortion, zoom, crop 값을 실시간으로 조정하고 PNG로 저장
- Panorama Editor에서 여러 이미지를 레이어로 올려 위치, 회전, 스케일, 불투명도 조정
- 서버 업로드 없이 로컬 브라우저 메모리 안에서 이미지 처리
구현 메모
입력 이미지를 texture로 올린 뒤 radial distance와 distortion coefficient를 사용해 샘플링 좌표를 재계산합니다. Panorama Editor는 projection, translation, rotation, scale 행렬을 조합해 레이어별 변환 결과를 WebGL canvas에 합성합니다.