diff --git a/WebGISPovertyMap/script.js b/WebGISPovertyMap/script.js index e97251c..2ecda7d 100644 --- a/WebGISPovertyMap/script.js +++ b/WebGISPovertyMap/script.js @@ -1,7 +1,38 @@ // ========================================== // 1. INISIALISASI PETA & LAYER // ========================================== -var map = L.map('map', { zoomControl: false }).setView([-0.0227, 109.3425], 14); +// 1. Definisikan Pilihan Basemap (Tile Layers) +var osm = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { + attribution: '© OpenStreetMap contributors' +}); + +var googleSatellite = L.tileLayer('http://{s}.google.com/vt/lyrs=s&x={x}&y={y}&z={z}', { + maxZoom: 20, + subdomains: ['mt0', 'mt1', 'mt2', 'mt3'], + attribution: 'Map data © Google' +}); + +var darkMap = L.tileLayer('https://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}{r}.png', { + attribution: '© OpenStreetMap contributors © CARTO' +}); + +// 2. Inisialisasi Peta +// Pastikan id 'map' sesuai dengan id div pada file index.php Anda +var map = L.map('map', { + center: [-0.0227, 109.3340], // Titik tengah peta (Pontianak) + zoom: 13, + layers: [osm] // Basemap default yang langsung aktif saat web dibuka +}); + +// 3. Gabungkan Basemap ke dalam satu Grup Objek +var baseMaps = { + "Peta Standar (OSM)": osm, + "Satelit (Google)": googleSatellite, + "Mode Gelap (Dark)": darkMap +}; + +// 4. Tambahkan Tombol Kontrol Layer ke Kanan Atas Peta +L.control.layers(baseMaps).addTo(map); // Zoom control di kanan bawah (lebih bersih) L.control.zoom({ position: 'bottomright' }).addTo(map);