2.8 KiB
Penjelasan Diagram WebGIS Kemiskinan & Masjid
1. Arsitektur Sistem (Three-Tier)
Sistem ini dibangun menggunakan arsitektur Three-Tier yang memisahkan aplikasi menjadi tiga lapisan utama. Lapisan pertama adalah Presentation Layer (Client) yang menggunakan HTML, CSS, JavaScript murni, dan Leaflet.js untuk menampilkan antarmuka peta interaktif kepada pengguna. Lapisan kedua adalah Business Logic Layer (Server) berbasis PHP murni yang menangani pemrosesan data, validasi, dan operasi CRUD melalui API endpoints. Lapisan ketiga adalah Data Layer berupa database MySQL (webgis_kemiskinan) yang bertugas menyimpan data spasial dan atribut dari entitas kemiskinan serta masjid secara persisten.
2. Alur Data Tambah Titik Kemiskinan
Proses penambahan data kemiskinan dimulai ketika operator mengklik lokasi tertentu pada peta yang memicu munculnya modal form input data. Setelah operator mengisi atribut seperti nama kepala keluarga, jumlah anggota, dan alamat, sistem pada sisi client (JavaScript) akan memvalidasi input tersebut sebelum mengirimkannya ke server melalui Fetch API (metode POST). Skrip PHP di server kemudian akan memvalidasi ulang data dan melakukan query INSERT ke database MySQL; jika berhasil, server mengembalikan respons sukses sehingga antarmuka peta dan daftar pada sidebar akan diperbarui secara real-time untuk menampilkan titik koordinat kemiskinan yang baru.
3. Alur Data Update Radius Masjid
Pembaruan radius layanan masjid dilakukan langsung melalui card masjid yang ada di sidebar tanpa perlu membuka halaman baru. Saat operator mengubah nilai radius dan menekan tombol Update, sistem memastikan nilai yang dimasukkan valid (berada dalam rentang 100 hingga 5.000 meter). Data ID masjid dan radius baru dikirimkan secara asinkron ke server PHP untuk memperbarui data di database (UPDATE), lalu secara instan client akan menyesuaikan ukuran lingkaran (circle) radius masjid pada peta serta menghitung dan memperbarui ulang warna marker kemiskinan (merah atau hijau) berdasarkan jangkauan radius yang baru.
4. Entity Relationship Diagram (ERD)
ERD sistem ini terdiri dari dua entitas utama yang saling independen secara struktural yaitu kemiskinan dan masjid, di mana masing-masing memiliki atribut Primary Key (id) serta menyimpan data koordinat spasial (latitude dan longitude). Keduanya tidak dihubungkan oleh Foreign Key relasional secara fisik di tingkat database, melainkan terhubung melalui relasi spasial logis yang dihitung pada sisi client (menggunakan fungsi jarak Leaflet). Status jangkauan sebuah keluarga miskin ditentukan secara dinamis dengan membandingkan jarak koordinat kemiskinan ke koordinat masjid terdekat; jika jarak tersebut lebih kecil atau sama dengan atribut radius milik masjid, maka keluarga tersebut masuk dalam area terjangkau.