이미지 분할

이미지 그리드 분할이란

이미지를 격자 형태의 작은 조각으로 나누는 작업은 인스타그램 그리드 레이아웃(사진 한 장을 여러 정사각형 타일에 걸쳐 올리는 것), 직소 퍼즐 스타일 콘텐츠, 모자이크 디스플레이용 타일 준비 등에서 흔히 쓰입니다. 이 도구는 업로드한 이미지를 원하는 행×열 개수를 지정하거나 고정 픽셀 크기를 지정해 균등한 조각으로 자른 뒤, 결과물 전체를 하나의 ZIP 파일로 묶어 다운로드할 수 있게 해줍니다.

분할 방식

이미지는 HTML 캔버스에 그려지고, 이 도구는 선택한 행·열 개수로 가로·세로 전체를 균등하게 나누거나, 고정 픽셀 크기를 이미지 전체를 덮을 때까지 반복하는 방식으로 각 조각의 경계를 계산합니다. 각 격자 칸은 캔버스에서 잘라낸 별도의 이미지로 추출되어 개별 PNG 파일로 인코딩되며, 이 도구에 내장된 순수 자바스크립트 ZIP 인코더로 모두 하나의 ZIP 압축파일로 묶입니다. 외부 라이브러리나 서버 업로드는 필요 없습니다.

자주 묻는 질문

분할을 위해 이미지가 서버로 업로드되나요?

아니요. 분할·자르기·ZIP 압축 모두 캔버스(canvas) API를 이용해 브라우저 안에서만 처리되며, 원본 이미지 파일이 어디로도 전송되지 않습니다.

이미지 크기가 선택한 격자로 정확히 나눠지지 않으면 어떻게 되나요?

고정 픽셀 크기 모드를 쓸 때, 이미지의 가로·세로가 지정한 크기로 딱 나눠떨어지지 않으면 오른쪽·아래쪽 가장자리 조각이 지정한 크기보다 작게 나올 수 있습니다. 빈 공간으로 채우는 대신 이미지의 실제 경계까지만 자르기 때문입니다.

왜 최대 1024조각(32×32)까지만 되나요?

너무 작은 조각으로 지나치게 많이 나누면 실용적인 가치는 줄어드는 반면 처리 시간과 결과 ZIP 파일 크기는 크게 늘어나므로, 이 도구는 처리 속도와 결과물 크기를 관리 가능한 수준으로 유지하기 위해 격자를 32×32까지로 제한합니다.