이미지 세로 병합기

원본: https://github.com/lmk/appendImges

이미지 세로 병합기

여러 이미지를 세로로 병합하여 하나의 긴 이미지로 만들어주는 웹 애플리케이션입니다.

기능

• 다중 이미지 업로드: 여러 이미지를 한 번에 선택하거나 드래그 앤 드롭으로 업로드
• 자동 정렬: 파일명의 숫자를 인식하여 자연스럽게 정렬 (예: 1, 2, 10, 20)
• 순서 변경: 드래그 앤 드롭으로 이미지 순서를 자유롭게 변경
• 개별 삭제: 원하지 않는 이미지를 개별적으로 삭제
• 미리보기: 병합 전 각 이미지의 썸네일과 순서를 확인
• 세로 병합: 선택한 이미지들을 세로로 연결하여 하나의 이미지로 생성
• 중앙 정렬: 너비가 다른 이미지들을 중앙 정렬하여 병합
• 다운로드: 병합된 이미지를 PNG 형식으로 다운로드

사용 방법

1. appendImges.html 파일을 웹 브라우저에서 엽니다
2. 드롭 영역을 클릭하거나 이미지 파일들을 드래그하여 업로드합니다
3. 필요한 경우 이미지를 드래그하여 순서를 변경합니다
4. 불필요한 이미지는 '삭제' 버튼으로 제거합니다
5. '이미지 병합하기' 버튼을 클릭합니다
6. 병합된 이미지를 확인하고 '다운로드' 버튼으로 저장합니다

기술 스택

• HTML5
• CSS3
• JavaScript (Vanilla)
• Canvas API

특징

• 별도 설치 불필요: 브라우저만 있으면 바로 사용 가능
• 오프라인 작동: 모든 처리가 브라우저 내에서 이루어지므로 인터넷 연결 불필요
• 개인정보 보호: 이미지가 서버로 전송되지 않고 로컬에서만 처리됨
• 반응형 UI: 직관적이고 사용하기 쉬운 인터페이스

브라우저 호환성

HTML5 Canvas API를 지원하는 모든 최신 브라우저에서 작동합니다:

• Chrome
• Firefox
• Safari
• Edge