Peta GeoJSON & TopoJSON Indonesia (38 Provinsi)

Source: Dev.to

Mengapa Ini Penting

Peta bukan sekadar visual yang menarik. Peta adalah fondasi dari data Anda.
Jika daftar provinsi tidak akurat, maka seluruh sistem ikut bermasalah: peta choropleth menjadi keliru, analitik tidak sesuai dengan wilayah sebenarnya, dan tooltip menampilkan nama yang salah.

Indonesia telah menambah beberapa provinsi baru—Papua Selatan, Papua Tengah, Papua Pegunungan, dan Papua Barat Daya—sehingga banyak dataset lama kini sudah tidak relevan. Bahkan, banyak sumber publik masih hanya menampilkan 34 provinsi.

Cakupan

Data Lengkap

38 provinsi, termasuk:

• Papua Selatan
• Papua Tengah
• Papua Pegunungan
• Papua Barat Daya

Dua Tipe Format

• GeoJSON – Mudah digunakan, kompatibel dengan Leaflet, Mapbox GL, dan overlay Google Maps.
• TopoJSON – Ukuran file ~80–90 % lebih kecil, waktu muat lebih cepat, ideal untuk D3.js dan visualisasi skala besar.

Bersih & Konsisten

• Nama provinsi yang telah dinormalisasi
• ID stabil untuk proses data join
• Tidak ada geometri duplikat
• Jalur (path) yang telah disederhanakan dan ramah web

GeoJSON vs TopoJSON (Ringkasan)

• Jika Anda membangun dashboard interaktif, TopoJSON adalah pilihan yang tepat.
• Jika Anda butuh yang plug‑and‑play, GeoJSON sudah sangat memadai.

Contoh Kasus Penggunaan

Dataset ini ideal untuk:

• 📊 Dashboard pemerintahan & layanan publik
• 🌋 Pelacakan bencana & banjir
• 🗳️ Peta pemilu & demografi
• 🚚 Perencanaan logistik & cakupan layanan
• 📍 Produk SaaS berbasis lokasi
• 📱 Visualisasi data yang mobile‑first

Contoh: Menggunakan GeoJSON dengan Leaflet

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);

Contoh: Menggunakan TopoJSON dengan D3.js

import * as d3 from "d3";
import { feature } from "topojson-client";

// Import file TopoJSON (mendukung 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);

// Konversi 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);

Unduh

Unduh dataset melalui repositori berikut:

• GeoJSON (38 Provinces) – indonesia-38-provinces.geojson
• TopoJSON (38 Provinces) – indonesia-38-provinces.topo.json