인도네시아 GeoJSON 및 TopoJSON 지도 (38개 도)
Source: Dev.to
왜 이것이 중요한가
지도는 단순히 보기 좋은 시각 자료가 아닙니다. 지도는 데이터의 기반입니다.
시도 목록이 정확하지 않다면 시스템 전체가 문제를 일으킵니다: choropleth 지도는 잘못 표시되고, 분석 결과는 실제 지역과 맞지 않으며, 툴팁은 잘못된 이름을 보여줍니다.
인도네시아는 최근에 몇 개의 새로운 주—남파푸아, 중파푸아, 산악파푸아, 남서파푸아—를 추가했으며, 이로 인해 오래된 데이터셋은 더 이상 유효하지 않습니다. 심지어 많은 공개 소스는 아직 34개 주만을 표시하고 있습니다.
범위
전체 데이터
38개 주, 포함:
- 남파푸아
- 중파푸아
- 산악파푸아
- 남서파푸아
두 가지 포맷
- GeoJSON – 사용이 쉽고 Leaflet, Mapbox GL, Google Maps 오버레이와 호환됩니다.
- TopoJSON – 파일 크기가 약 80–90 % 작아 로드 시간이 빠르고, D3.js 및 대규모 시각화에 이상적입니다.
정제·일관성
- 정규화된 주 이름
- 데이터 조인을 위한 안정적인 ID
- 중복 지오메트리 없음
- 웹 친화적으로 단순화된 경로
GeoJSON vs TopoJSON (요약)
| 특징 | GeoJSON | TopoJSON |
|---|---|---|
| 가독성 | ✅ 높음 | ⚠️ 보통 |
| 파일 크기 | ❌ 큼 | ✅ 매우 작 |
| 브라우저 성능 | ⚠️ 느릴 수 있음 | ✅ 빠름 |
| 가장 적합한 용도 | 간단한 지도 | 데이터 시각화, 대시보드 |
- 대시보드와 같은 인터랙티브 환경을 구축한다면 TopoJSON이 적합합니다.
- 플러그‑앤‑플레이가 필요하다면 GeoJSON만으로도 충분합니다.
활용 사례
이 데이터셋은 다음에 이상적입니다:
- 📊 정부·공공 서비스 대시보드
- 🌋 재난·홍수 추적
- 🗳️ 선거·인구통계 지도
- 🚚 물류·서비스 커버리지 계획
- 📍 위치 기반 SaaS 제품
- 📱 모바일‑우선 데이터 시각화
예시: Leaflet과 함께 GeoJSON 사용하기
import L from "leaflet";
import indonesiaProvinces from "./indonesia-38-provinces.geojson";
L.geoJSON(indonesiaProvinces, {
style: {
color: "#1e40af",
weight: 1,
fillOpacity: 0.6,
},
onEachFeature: (feature, layer) => {
layer.bindPopup(feature.properties.province);
},
}).addTo(map);
예시: D3.js와 함께 TopoJSON 사용하기
import * as d3 from "d3";
import { feature } from "topojson-client";
// Import file TopoJSON (Vite / Webpack / Next.js 지원)
import topoData from "./indonesia-38-provinces.topo.json";
const width = 800;
const height = 600;
const svg = d3
.select("#map")
.append("svg")
.attr("width", width)
.attr("height", height);
const projection = d3
.geoMercator()
.fitSize([width, height], feature(topoData, topoData.objects.indonesia_provinces));
const path = d3.geoPath().projection(projection);
// TopoJSON → GeoJSON 변환
const provinces = feature(topoData, topoData.objects.indonesia_provinces);
svg
.selectAll("path")
.data(provinces.features)
.enter()
.append("path")
.attr("d", path)
.attr("fill", "#60a5fa")
.attr("stroke", "#1e3a8a")
.append("title")
.text(d => d.properties.province);
다운로드
다음 저장소에서 데이터셋을 다운로드하세요:
- GeoJSON (38 Provinces) – indonesia-38-provinces.geojson
- TopoJSON (38 Provinces) – indonesia-38-provinces.topo.json