Pengajuan Data Database Spasial

Pada Gambar 4.23 menampilkan interaksi pada saat user ingin melihat menu peta. User yang memiliki hak akses ini adalah admin. Admin dapat memilih mengedit atau menghapus data atribut peta. Admin juga dapat cetak data atribut peta. f. Sequence Diagram Admin dengan Profil Gambar 4.24 Sequence Diagram Admin dengan Profil Pada Gambar 4.24 menampilkan interaksi ketika admin mengelola profil. Aktor memilih menu mengelola profil, maka sistem akan menampilkan : admin : admin : profil : profil profil profil 1: memilih menu manajemen profil 2: membaca data 3: memberikan data 4: menampilkan halaman profil 5: pilih edit 6: menampilkan form profil 7: input form profil 8: pilih simpan 9: menyimpan data 10: berhasil disimpan 11: menampilkan pesan berhasil disimpan halaman profil, kemudian aktor memilih edit, lalu sistem akan menampilkan form profil, kemudian aktor menginput form profil dan pilih simpan, maka sistem akan menyimpan dan menampilkan pesan berhasil disimpan. g. Sequence Diagram Masyarakat dengan Profil Gambar 4.25 Sequence Diagram Masyarakat dengan Profil Pada Gambar 4.25 menampilkan interaksi ketika Masyarakat melihat profil. Aktor memilih menu profil, maka sistem akan menampilkan halaman profil. : Masyarakat : Masyarakat : profil : profil Profil Profil 1: memilih menu profil 2: membaca data 3: memberikan data 4: menampilkan halaman profil h. Sequence Diagram Masyarakat, BNPB dan PU dengan Peta Gambar 4.26 Sequence Diagram Masyarakat, BNPB dan PU dengan Peta Pada Gambar 4.26 menampilkan interaksi ketika Masyarakat, BNPB dan PU ingin melihat peta. Aktor memilih menu peta, maka sistem akan menampilkan halaman peta. : Masyarakat, BNPB dan PU : Masyarakat, BNPB dan PU : Tampilan Awal : Tampilan Awal : Tampilan Peta : Tampilan Peta Tampilan 3 Dimensi Tampilan 3 Dimensi Tampilan Legenda Tampilan Legenda Data Atribut Peta Data Atribut Peta Peta Peta 1: Memilih menu peta 2: Menampilkan halaman peta 3: Memilih tampil 3 dimensi 4: Membaca database 5: Menampilkan layer peta 3 dimensi 6: Memilih tampil legenda 7: Membaca database 8: Menampilkan halaman legenda 9: Memilih tampil data atribut peta 10: Membaca database 11: Menampilkan halaman atribut peta 12: Memilih cetak peta 13: Membaca database 14: Menampilkan halaman cetak peta 15: Mencetak Peta 16: Data berhasil di cetak i. Sequence Diagram Masyarakat dengan Berita Gambar 4.27 Sequence Diagram Masyarakat dengan Berita Pada Gambar 4.27 menampilkan interaksi ketika masyarakat ingin melihat berita. Aktor memilih menu berita, maka sistem akan menampilkan halaman berita. : Masyarakat : Masyarakat Form Berita Form Berita Berita Berita 1: Memilih menu berita 2: Membaca data 3: Memberikan data 4: Menampilkan halaman berita j. Sequence Diagram Masyarakat dengan Kritik dan Saran Gambar 4.28 Sequence Diagram Masyarakat dengan Kritik dan Saran Pada Gambar 4.28 menampilkan interaksi ketika Masyarakat ingin memberikan kritik dan saran. Aktor memilih menu kritik dan saran, maka sistem akan menampilkan form kritik dan saran. Aktor mengisi form kritik dan saran lalu pilih kirim, kemudian sistem menyimpan data dan menampilkan pesan data berhasil dikirim. : Masyarakat : Masyarakat : form kritik dan saran : form kritik dan saran kritik dan saran kritik dan saran 1: memilih menu kritik dan saran 2: menampilkan form kritik dan saran 3: mengisi form kritik dan saran 4: pilih kirim 5: menyimpan data 6: berhasil disimpan 7: menampilkan pesan berhasil dikirim k. Sequence Diagram Admin dengan Kelola Data Gambar 4.29 Sequence Diagram Admin dengan Kelola Data Pada Gambar 4.29 menampilkan interaksi ketika admin mengelola data. Aktor memilih halaman kelola data, maka sistem akan menampilkan halaman kelola data, kemudian aktor : Admin : Admin : Tampilan kelola data : Tampilan kelola data Kelola Data Kelola Data Pengajuan Data Pengajuan Data Laporan Data Laporan Data 1: Memilih halaman kelola data 2: Membaca data 3: Memberikan data 4: Menampilkan halaman kelola data 5: Memilih menu pengajuan data 6: Membaca data 7: Memberikan data 8: Menampilkan list pengajuan data 9: Mengunduh pengajuan data 10: Membaca data 11: Data terunduh 12: Memilih menu laporan data 13: Membaca data 14: Memberikan data 15: Menampilkan form laporan data 16: Mengisi form laporan data 17: Mengirim laporan data 18: Memberikan data 19: Data terkirim memilih pengajuan data, lalu sistem akan menampilkan list pengajuan data, kemudian aktor mendownload pengajian data profil dengan mengklik button download, maka sistem akan menyimpan dan menampilkan pesan berhasil didownload. Kemudian admin memilih halaman laporan data, lalu sistem akan menampilkan form laporan data, kemudian admin melakukan isi form laporan data dan klik “kirim”, maka sistem akan mengirim laporan data yang sudah terinput. l. Sequence Diagram BNPB dengan Pengajuan Data Gambar 4.30 Sequence Diagram BNPB dengan Pengajuan Data Pada Gambar 4.30 menampilkan interaksi ketika BNPB. Aktor memilih halaman pengajuan data, maka sistem akan menampilkan form pengajuan data, kemudian aktor mengisi form pengajuan data dan mengirim setelah data tersebut terisi, lalu sistem akan mengirim data yang sudah di isi. Jika data : BNPB : BNPB : form pengajuan data : form pengajuan data Pengajuan data Pengajuan data 1: Memilih halaman pengajuan data 2: Membaca data 3: Memberikan data 4: Menampilkan form pengajuan data 5: Mengisi pengajuan data 6: Mengupload pengajuan data 7: Membaca data 8: Menyimpan data 9: pengajuan data terupload 10: Mengirim pengajuan data 11: Membaca data 12: Mengirim data 13: Pengajuan data terkirim tersebut tidak terisi maka sistem akan menampilkan kembali form pengajuan data. m. Sequence Diagram PU dengan Laporan Data Gambar 4.31 Sequence Diagram PU dengan Laporan Data Pada Gambar 4.31 menampilkan interaksi ketika PU melakukan pengecekkan laporan data. Aktor memilih halaman laporan data, maka sistem akan menampilkan list laporan data, kemudian aktor mencetak laporan data, lalu sistem akan mencetak laporan data. Laporan Data Laporan Data : PU : PU : Tampilan laporan data : Tampilan laporan data 1: Memilih halaman laporan data 2: Membaca data 3: Memberikan data 4: Menampilkan list laporan data 5: Mencetak laporan data 6: Memberikan data 7: Data tercetak

4.3.2. Perancangan Database

Spesifikasi Database Berikut ini adalah penjelasan dari spesifikasi database Sistem Informasi Spasial berbasis Web pada Kawasan Rawan Banjir :

a. Database Spasial

1. Tabel Polygon Rawan Banjir Nama File : Rawan_Banjir.dbf Isi : Data Rawan Banjir Primary Key : Id_Rawan_Banjir Type : Polygon Tabel 4.16 Database Kawasan Rawan Banjir Field Tipe Panjang Id_rawan_banjir String 4 Kecamatan Text - Kelurahan Text - Data Text - Penyebab Text - Keterangan Text - 2. Tabel Polygon Kecamatan Nama File : kecamatan.dbf Isi : Data Atribut kecamatan Primary Key : id_kec Type : Point Tabel 4.17 Database Kecamatan Field Tipe Panjang ID_KEC string 3 NAMA_KEC string 20 JML_KEL short 3 3. Tabel Polygon Drainase Nama File : drainase.dbf Isi : Data Atribut drainase Primary Key : Id_drainase Type : Polygoni Tabel 4.18 Database Drainase Field Tipe Panjang ID_DRAIN string 8 NM_DRAIN string 30 T_DRAIN short 1

b. Database Non Spasial

1. Tabel Berita Nama File : berita.sql Isi : Data Atribut Berita Primary Key : id_berita Tabel 4.19 Database Berita Field Tipe Panjang Id_berita Int 5 Id_kategori Int 5 Id_user varchar 50 Judul varchar 100 Isi_berita Text - Gambar varchar 100 Tanggal Date - Jam Time - 2. Tabel Profil Nama File : profil.sql Isi : Data Atribut Profil Primary Key : id_profil Tabel 4.20 Database Profil Field Tipe Panjang Id_profil Int 11 Judul varchar 100 Isi Text - Gambar varchar 30 3. Tabel Kritik dan Saran Nama File : hubungi.sql Isi : Data Atribut Kritik dan Saran Primary Key : id_profil Tabel 4.21 Database Kritik dan Saran Field Tipe Panjang Id_hubungi Int 5 Pengirim varchar 50 Email varchar 50 Pesan Text - 4. Tabel Admin Nama File : user.sql Isi : Data Atribut Admin Primary Key : id_user Tabel 4.22 Database Admin Field Tipe Panjang Id_user Int 3 Username varchar 50 Password varchar 100 Nama_lengkap varchar 100 Email varchar 100 Level varchar 50 Jum Int 1

4.3.3. Perancangan User Interface

1. Perancangan Struktur Menu Perancangan struktur menu bertujuan untuk memberikan rancangan struktur menu pada Sistem Informasi Spasial Kawasan Rawan Banjir. Adapun struktur menu Sistem Informasi Spasial Kawasan Rawan Banjir antara lain: a. Struktur Menu Bagian Fisik dan Prasarana Admin Gambar 4.32 Struktur Menu Bagian Fisik dan Prasarana Admin b. Struktur Menu Masyarakat Gambar 4.33 Struktur Menu Masyarakat Login Halaman Utama Home Profil berita Kritik dan Saran Peta Login Halaman Admin Kelola User Kelola Profil Kelola berita Kelola Kritik dan Saran Kelola Data c. Struktur Menu BNPB Gambar 4.34 Struktur Menu BNPB d. Struktur Menu PU Gambar 4.35 Struktur Menu PU Login Halaman Utama Home Peta Laporan Data Login Halaman Utama Home Peta Pengajuan data 2. Perancang User Interface Perancangan user interface bertujuan untuk memberikan rancangan halaman-halaman yang terdapat pada Sistem Informasi Spasial Kawasan Rawan Banjir. Adapun user interface Sistem Informasi Spasial Kawasan Rawan Banjir antara lain: a. Halaman Bagian Fisik dan Prasarana Admin 1. Halaman Registrasi Gambar 4.36 Halaman Registrasi HEADER Form Registrasi Footer Save Batal 2. Halaman Login Gambar 4.37 Halaman login 3. Halaman Admin Gambar 4.38 Halaman Admin Header Logo Container Side Bar Menu Footer Kelola Akun Kelola Profil Kelola Berita Kelola Kritik dan Saran Halaman Admin Peta Halaman Utama Keluar Kelola Data HEADER Username Password Login Footer 4. Halaman Kelola Peta Gambar 4.39 Halaman Kelola Peta 5. Halaman Kelola Berita Gambar 4.40 Halaman Kelola Berita Header Logo Container Side Bar Menu Footer Kelola Akun Kelola Profil Kelola Berita Kelola Kritik dan Saran Peta Halaman Utama Halaman Admin List Berita Edit | Hapus Tambah Keluar Kelola Data Header Logo Container Footer Peta Halaman Utama Halaman Admin Menu Layer  Jalan  Rawan_Banjir  Drainase  Kelurahan  Kecamatan Peta Geoexplorer | Map | Cetak | Identify | Query | Pengukuran | Edit 6. Halaman Kelola Akun Gambar 4.41 Halaman Kelola Akun 7. Halaman Kelola Kritik dan Saran Gambar 4.42 Halaman Kelola Kritik dan Saran Header Logo Container Side Bar Menu Footer Kelola Akun Kelola Berita Kelola Kritik dan Saran Peta Halaman Utama Halaman Admin Daftar Kritik dan Saran Hapus Kelola Data Keluar Kelola Profil Header Logo Container Side Bar Menu Footer Kelola Akun Kelola Profil Kelola Berita Kelola Kritik dan Saran Peta Halaman Utama Halaman Admin List User Edit | Hapus Tambah Kelola Data Keluar