교재용 3D 지구본, 비용 폭탄 없이 만들기
어떤 상황?
교재·웹에 넣을 인터랙티브 3D 지구본을 Mapbox API로 만들었는데, 교재 QR로 학생들이 한꺼번에 몰리면 비용·보안이 걱정될 때. Mapbox 무료는 월 5만 로드까지인데, 학기 초·시험 기간에 이 한도를 넘기기 쉽고 그때부터 청구가 들어옵니다. 접속량에 따라 들쭉날쭉해서 출판사 입장에선 예측이 어렵고, 토큰이 노출되면 어뷰징 위험도 있습니다. 그래서 교재용으로 Mapbox를 그대로 쓰기엔 부담이 맞아요.
핵심 답변 - MapLibre로 갈아타되, 진짜 포인트는 “타일 직접 호스팅”
지도는 두 개의 부품으로 돌아가고, 돈이 드는 건 두 번째뿐입니다.
- ① 지도 엔진(라이브러리) - MapLibre GL JS: 영구 무료. Mapbox와 거의 100% 호환이라, 만드신 코드는
import mapboxgl을import maplibregl로 바꾸는 정도면 거의 그대로 돌아갑니다. - ② 지도 그림(타일) - 여기서 돈이 나갑니다: 남의 서버에서 타일을 받는 한, 대량 접속이면 결국 과금됩니다.
MapLibre가 Mapbox보다 나은 진짜 이유는 무료 한도가 커서가 아니라, ‘타일을 직접 호스팅할 수 있어서’입니다. 지도 그림을 우리 쪽 서버(또는 CDN)에 올려두면 학생이 몇 명이 보든 접속당 비용이 0이 됩니다.
이렇게 가시면 됩니다
- OpenFreeMap(키·가입 없음)으로 먼저 띄워서 확인
- Protomaps PMTiles로 만들어 Cloudflare R2 같은 데 올리기
이러면 ‘요청당 과금’이 아니라 ‘트래픽(전송)량’ 비용이라, 학기 초·시험 기간에 몰려도 청구 폭탄이 안 생깁니다. 한국지리 단원은 **VWorld(국토교통부, 무료)**를 쓰시면 한국 디테일도 좋고 비용도 0이에요.
바이브코딩으로 직접 만드시면 됩니다
이미 직접 지구본을 만들어보셨다면, 비용 0 구조로 다시 만드는 것도 바이브코딩으로 AI에게 단계별로 시키면 됩니다. 이렇게 말해보세요.
“MapLibre GL JS로 3D 지구본 웹페이지를 만들어줘. ① 먼저 OpenFreeMap(키 없음)으로 띄워서 확인하고, ② 그다음 Protomaps PMTiles 구조로 바꿔서 Cloudflare에 올려, 접속량과 상관없이 비용이 고정되게. 나는 비개발자라 단계별로 안내해줘.”
더 안전하게 가려면, 타일을 완전히 자체 서버에 올리는 방식을 개발팀과 의논해보셔도 좋아요. 그러면 외부 의존·키 노출·과금 변수가 전부 사라져서 보안 걱정까지 같이 해결됩니다.
✅ 바로 써보는 도구
“진짜 될까?” 싶어서 Cloudflare에 올리기 전 단계까지 실제로 돌아가는 걸 만들어 봤습니다. 페이지 맨 아래 **“관련 자료”**에서 바로 열려요.
- 🌐 3D 지구본 (globe-app): MapLibre + OpenFreeMap/위성 타일. 2D·3D 전환, 위성/국가구분/백지도, 한국어 지명 토글. API 키·계정 없이 돌아갑니다(= 비용 0 프로토타입).
정리: 라이브러리(MapLibre)는 공짜, 핵심은 타일을 PMTiles로 직접 호스팅해서 접속당 비용을 0으로 만드는 것. 한국지리는 VWorld 무료 API로 보완. 그리고 이 전부를 바이브코딩으로 직접 만들 수 있습니다.