# WebGIS Jalan dan Jalan Rusak

Aplikasi WebGIS berbasis PHP, MySQL, dan Leaflet untuk mengelola data jalan, parsil tanah, serta titik kerusakan jalan. Aplikasi ini menyediakan peta interaktif untuk menggambar geometri, menyimpan data spasial dalam format GeoJSON, melihat dashboard data, dan melaporkan titik kerusakan melalui foto.

## Fitur

- Peta interaktif berbasis Leaflet dan Google Maps tile.
- Input data jalan dalam bentuk polyline dengan perhitungan panjang otomatis.
- Input data parsil tanah dalam bentuk polygon dengan perhitungan luas otomatis.
- Input titik kerusakan jalan dalam bentuk marker dengan unggahan foto.
- Lapor titik kerusakan otomatis dari foto yang memiliki metadata GPS EXIF.
- Edit geometri jalan dan parsil langsung dari peta.
- Dashboard ringkasan jumlah data jalan, parsil, dan titik kerusakan.
- Tabel data dengan pencarian dan pratinjau lokasi pada minimap.
- API sederhana untuk operasi CRUD data.

## Teknologi

- PHP
- MySQL / MariaDB
- PDO
- HTML, CSS, JavaScript
- Leaflet
- Leaflet Draw
- Turf.js
- EXIF.js
- Font Awesome

## Kebutuhan Sistem

- PHP 7.4 atau lebih baru
- MySQL atau MariaDB
- Web server lokal seperti Laragon, XAMPP, atau Apache/Nginx dengan PHP
- Browser modern
- Koneksi internet untuk memuat library CDN dan tile peta

## Instalasi

1. Clone repository ini ke folder web server lokal.

   ```bash
   git clone https://github.com/GuavaPopper/WebGIS_Jalan-JalanRusak.git
   ```

2. Masuk ke folder project.

   ```bash
   cd WebGIS_Jalan-JalanRusak
   ```

3. Buat database dan tabel dari file `schema.sql`.

   ```bash
   mysql -u root -p < schema.sql
   ```

   Jika memakai Laragon atau phpMyAdmin, import file `schema.sql` secara manual ke MySQL/MariaDB.

4. Buat file `.env` di root project.

   ```env
   DB_HOST=127.0.0.1
   DB_NAME=webgis_jalan
   DB_USER=root
   DB_PASS=
   ```

5. Pastikan folder `uploads/` tersedia dan dapat ditulis oleh web server.

6. Jalankan project melalui web server lokal, misalnya:

   ```text
   http://localhost/WebgisJalan/
   ```

   Sesuaikan URL dengan nama folder dan konfigurasi virtual host yang digunakan.

## Struktur Project

```text
.
|-- api/
|   |-- jalan.php
|   |-- parsil.php
|   `-- titik.php
|-- assets/
|   |-- css/
|   |   `-- style.css
|   `-- js/
|       `-- app.js
|-- uploads/
|-- config.php
|-- index.php
|-- schema.sql
`-- README.md
```

## Konfigurasi Database

File `config.php` membaca konfigurasi dari `.env`, lalu membuat koneksi database dengan PDO.

Variabel yang digunakan:

| Variabel | Keterangan | Default |
| --- | --- | --- |
| `DB_HOST` | Host database | `127.0.0.1` |
| `DB_NAME` | Nama database | `webgis_jalan` |
| `DB_USER` | Username database | `root` |
| `DB_PASS` | Password database | kosong |

## Endpoint API

### Jalan

Endpoint: `api/jalan.php`

| Method | Fungsi |
| --- | --- |
| `GET` | Mengambil semua data jalan |
| `POST` | Menambahkan data jalan |
| `PUT` | Memperbarui data jalan |
| `DELETE` | Menghapus data jalan |

### Parsil

Endpoint: `api/parsil.php`

| Method | Fungsi |
| --- | --- |
| `GET` | Mengambil semua data parsil |
| `POST` | Menambahkan data parsil |
| `PUT` | Memperbarui data parsil |
| `DELETE` | Menghapus data parsil |

### Titik Kerusakan

Endpoint: `api/titik.php`

| Method | Fungsi |
| --- | --- |
| `GET` | Mengambil semua titik kerusakan |
| `POST` | Menambahkan atau memperbarui titik kerusakan dengan foto |
| `PUT` | Memperbarui GeoJSON titik kerusakan |
| `DELETE` | Menghapus titik kerusakan dan file foto terkait |

## Cara Penggunaan

1. Buka halaman utama aplikasi.
2. Gunakan toolbar gambar di sisi kiri peta.
3. Pilih bentuk sesuai data:
   - Polyline untuk data jalan.
   - Polygon untuk data parsil tanah.
   - Marker untuk titik kerusakan jalan.
4. Isi form yang muncul, lalu simpan data.
5. Buka tab `Lihat Data` untuk melihat ringkasan dan tabel data.
6. Klik baris pada tabel untuk melihat lokasi pada minimap.
7. Gunakan tombol laporan via foto EXIF jika foto memiliki metadata GPS.

## Catatan

- File `.env` sebaiknya tidak diunggah ke repository publik karena berisi konfigurasi lokal.
- File foto laporan disimpan di folder `uploads/`.
- Perhitungan panjang dan luas dilakukan di sisi frontend menggunakan Turf.js.
- Aplikasi membutuhkan koneksi internet untuk memuat CDN Leaflet, Font Awesome, Turf.js, EXIF.js, dan tile peta.