Perancangan Web
3.3 Perancangan Web
Pada bagian ini akan dibahas mengenai proses perancangan aplikasi web dengan mempertimbangkan kebutuhan-kebutuhan atau spesifikasi yang telah ditetapkan pada tahap analisis sistem. Dalam perancangan aplikasi ini dibagi menjadi dua bagian yaitu gambaran awal aplikasi peta dan gambaran awal aplikasi web.
3.3.1 Gambaran Aplikasi Peta
Gambaran aplikasi dibagi menjadi dua buah yaitu gambaran visualisasi data, gambaran query peta.
a. Gambaran Visualisasi Data
Gambaran ini berfungsi untuk memvisualisasikan peta digital dari kontur kota, profil kota, jalan, sungai, potensi pertanian, potensi pariwisata, potensi perindustrian beserta atribut-atribut peta seperti peta referensi, navigasi, dan legenda. Modul ini dibangun dengan menggunakan aplikasi Chameleon sebagai media untuk mengeksekusi peta sehingga dapat tampil pada media website . Chameleon adalah framework yang dapat digunakan dengan baik pada webGis. Dapat digunakan secara berdampingan atau full integrated dengan dengan Mapserver berdasarkan spesifikasi yang ditentukan oleh Open Geospatial Consortium (OGC). Fungsi Chameleon sebagai sebuah produk dari Open Source yang dibangun dengan bahasa pemprograman PHP. Chameleon memberikan akses yang sederhana ke beberapa fitur yang hanya bisa diakses dalam MapScript dimana telah disediakan sebuah script yang telah jadi sebagai komponen yang dapat di gunakan. Dengan Chameleon seorang yang bukan programmer memungkinkan untuk memasukan komponen pada applikasi web SIG.
Alur proses ini dapat dilihat pada gambar 3.1 :
Data Base Peta
Gambar 3.1 Alur proses visualisasi data Peta
b. Gambaran Query Peta Modul ini berfungsi untuk menangani proses query yang dilakukan pengguna pada saat mengklik salah satu titik yang ada ada muka peta. Hasil dari query ini adalah berupa informasi mengenai titik, garis atau poligon pada peta tersebut. Informasi yang ditampilkan dalam aplikasi ini meliputi informasi mengenai jalan, sungai, profil kota dan informasi potensi kota. Modul ini dibangun dengan menggunakan tool yang sudah terdapat dalam Chameleon.
Alur kerja gambaran ini dapat dilihat pada gambar 3.2 :
Query User pada peta
Data Base Peta
Gambar 3.2 Alur kerja gambaran query posisi
3.3.2 Perancangan Basis Data
Sebelum merancang basis data maka perlu dibuat terlebih dahulu data flow digram , yang menjelaskan tentang fungsi-fungsi dan alur kerja yang terdapat dalam sistem informasi tersebut secara logika. Data flow diagram akan dapat menginterpretasikan Logical Model dari suatu sistem.
Beberapa simbol yang digunakan dalam DFD antara lain:
Simbol
Nama Simbol
Keterangan
Merupakan kegiatan atau
0 pekerjaan yang dilakukan oleh orang atau mesin komputer,
Proses (Process)
Proses
dimana aliran data masuk,
ditranformasikan ke aliran data keluar.
Komponen yang berfungsi untuk
Penyimpanan
menyimpan data/file adalah fungsi
1 Data Store
Data (Data Store)
yang mentransformasikan data secara umum.
Merupakan sumber atau tujuan
Sumber data /
dari arus data yang dapat
Sumber Data
tujuan data
digambarkan secara fisik, (Entity) seseorang atau sekelompok orang
atau system lain.
Disimbolkan dengan anak panah,
Aliran Data
dimana arus data mengalir (Flowline) diantara proses, simpangan data,
kesatuan luar, kesatuan ruang.
Gambar 3.3 Simbol dalam DFD
3.3.3 Context Diagram
Context Diagram pencemaran lingkungan merupakan gambaran secara umum untuk mengidentifikasikan komponen-komponen sistem informasi yang ada Kota Blitar secara terinci.
Pada sistem informasi geografis profil darah Kota Blitar, diagram arus datanya dapat dilihat pada gambar 3.4.
input profil 1 lihat profil input peta industri
isi_tanam_modal input peta pertanian
lihat berita input peta pariwisata
tulis komentar input berita
SIG PROFIL
input fasilitas lihat peta
DAERAH
tampil peta industri tampil berita
tampil profil tampil peta pertanian tampli fasilitas tampil peta pariwisata
Admin
tampil peta fasilitas tampil peta
Pengguna
tampil profil tanam_modal
tampil komentar
tampil berita
Gambar 3.4 Contex Diagram
Pada Konteks Diagram diatas dapat dilihat bahwa proses yang terjadi dalam aplikasi SIG profil daerah Kota Blitar melibatkan dua sumber atau tujuan data yaitu pengguna, dan admin.
1. Admin Bagian admin bertugas mengelola profil, menambah peta fasilitas, menambah
peta pertanian, menambah peta periwisata, menambah peta perindustrian, dan menambah database peta.
2. Pengguna Sementara pengguna dari aplikasi ini dapat memproleh informasi tentang profil
Kota Blitar yang ditampilkan dengan memilih menu yang sudah disediakan. Menu yang disediakan meliputi profil potensi kota, berita terbaru tentang Kota Blitar, melihat peta beserta informasinya, dan memberikan komentar.
3.3.4 Data Flow Diagram (DFD)
1. DFD Level 1 Diagram alur data level 1 pada gambar 3.5 memuat proses-proses inti yang ada didalam sistem, yaitu proses administrasi, proses login, proses informasi, dan proses penampilan peta.
input profil input peta industri
Login Admin tampil profil
input berita
tampil komentar
input peta pertanian
Admin
Konfirmasi Login Admin tampil berita tanam_modal
input peta pariwisata Pengguna input fasilitas
tampil peta
tampli fasilitas
1 tampil peta fasilitas
Login
tampil peta industri
Administrasi
tampil berita tampil profil
tampil peta pertanian tampil peta pariwisata
10 Tanam modal
simpan_tanam_modal
lihat berita Lihat Peta Umum Simpan User
info_tanam_modal
lihat profil
Informasi
1 User
isi_tanam_modal
Baca Data User
lihat peta tulis komentar
Simpan Berita
2 Berita
Ambil Data Berita
3 Profil
Simpan Profil
Ambil Data Profil
Simpan Komentar
8 Komentar
Ambil Data Komentar
4 Peta Industri
Simpan Peta Industri
Ambil Data Peta Industri
Simpan Peta Pariwisata
5 Peta Pariwisata
Ambil Data Peta Pariwisata
Proses Peta Simpan Peta Pertanian
6 Peta Pertanian
Ambil Data Peta Pertanian
Simpan Peta Fasilitas
9 peta fasilitas
Ambil Data Peta Fasilitas
Gambar 3.5 DFD Level 1 Proses Peta
Dalam level 1 SIG profil Kota Blitar terdapat empat proses yang dilakukan oleh admin dan pengguna.
a. Proses 1 adalah administrator yang menangani manajemen data yang akan ditampilkan dalam website. Data-data disimpan dalam database yang ada. Admin melakukan input data yaitu data profil, data peta fasilitas, data peta industri, data peta pertanian, data peta pariwisata, dan data tentang berita terkini. Administrator memberikan laporan ke admin berupa tampilan dari data-data yang dimasukkan, kemudian melakukan penyimpanan ke tabel database .
b. Proses 2 yaitu informasi. Ini merupakan proses yang menangani semua informasi yang akan ditampilkan dalam website. Informasi tersebut diambil dari database untuk disajikan kepada pengguna yang mengakses halaman tersebut. Selain pengguna melihat semua informasi yang ada, pengguna juga dapat memberikan komentar.
c. Proses 3 yaitu login user. Proses ini digunakan untuk mengecek login user untuk mendapatkan hak akses untuk mengelola content database. Setiap kali user melakukan login, data yang dimasukkan akan dicek dengan data yang ada dalam database. Apabila data tersebut sama dengan database, maka user dapat akses untuk mengelola content database. Namun, apabila tidak sama, maka sistem akan menolak user tersebut untuk masuk kedalam sistem.
d. Proses 4 yaitu proses peta, ini merupakan proses yang menangani semua yang berhubungan dengan peta yang ditampilkan dalam website. Admin dapat d. Proses 4 yaitu proses peta, ini merupakan proses yang menangani semua yang berhubungan dengan peta yang ditampilkan dalam website. Admin dapat
2. DFD Level 2
tampil peta industri
Proses Peta Industri
Simpan Peta Industri
4 Peta Industri
input peta industri
3 Profil
tampil profil
Proses Profil
Simpan Profil
input profil
tampil peta pertanian
Proses Peta
6 Peta Pertanian
input peta pertanian
Pertanian
Simpan Peta Pertanian
tampil peta pariwisata
8 Proses Peta
Simpan Peta Pariwisata
5 Peta Pariwisata
input peta pariwisata
Pariwisata
Admin
input fasilitas
Simpan Peta Fasilitas
9 peta fasilitas
Proses Peta
tampil peta fasilitas
Fasilitas
Input Komentar
Simpan Komentar
8 Komentar
Tampil Komentar
Proses Komentar
1 User
Input User
Proses User
Simpan User
Tampil User
input_tanam_modal
10 Tanam modal
Prcs_346
simpan_tanam_modal
tampil_modal 3
2 Berita
input berita
Proses Berita
Simpan Berita
tampil berita
Gambar 3.6 DFD Level 2 SIG Proses Profil Kota
Pada DFD level 2 proses peta SIG Proses Profil Kota ini merupakan pengembangan dari proses peta yang terdapat pada DFD level 1. Disini dijelaskan lebih terperinci mengenai alus semua proses profil kota mulai dari proses berita, proses profil, proses komentar, proses user, proses peta fasilitas, proses peta industri, proses peta pertanian, dan proses peta perindustrian. Setiap proses melakukan penyimpanan ke databese.
3.3.5 Entity Relationship Diagram (ERD)
Entity Relationship Diagram (ERD) adalah sebuah diagram yang menggambarkan hubungan atau relasi antar Entity, dan setiap Entity terdiri atas satu atau lebih atribut yang mempresentasikan seluruh kondisi (fakta) dari yang kita tinjau.
Diagram relasi entitas (entity relationship diagram-ERD) seperti ditunjukkan oleh namanya, berhubungan dengan data didalam entitas dan hubungan antar entitas. Ketika pengguna dan spesialis informasi mulai untuk berkomunikasi tentang kebutuhan data untuk suatu sistem informasi, mereka akan berbicara mengenai pengumpulan field-field data yang saling berhubungan daripada field-field data individu. Kumpulan konseptual field-field data yang saling berhubungan ini disebut entitas (entities). Meskipun secara intuitif kita akan langsung tertarik untuk menganggap entitas sebagai tabel-tabel, kita tidak dapat melakukannya. Tabel merupakan hasil dari pemecahan entitas menjadi unit-unit berukuran lebih kecil yang mengkuti aturan-aturan struktur basis data. Suatu entitas dapat berubah menjadi satu Diagram relasi entitas (entity relationship diagram-ERD) seperti ditunjukkan oleh namanya, berhubungan dengan data didalam entitas dan hubungan antar entitas. Ketika pengguna dan spesialis informasi mulai untuk berkomunikasi tentang kebutuhan data untuk suatu sistem informasi, mereka akan berbicara mengenai pengumpulan field-field data yang saling berhubungan daripada field-field data individu. Kumpulan konseptual field-field data yang saling berhubungan ini disebut entitas (entities). Meskipun secara intuitif kita akan langsung tertarik untuk menganggap entitas sebagai tabel-tabel, kita tidak dapat melakukannya. Tabel merupakan hasil dari pemecahan entitas menjadi unit-unit berukuran lebih kecil yang mengkuti aturan-aturan struktur basis data. Suatu entitas dapat berubah menjadi satu
Gambar ERD Sistem Informasi Geografis untuk mengetahui profil potensi Kota Blitar keseluruhan.
mast er_produksi_pertanian
mast er_jumlah_industri
id_produksi
s erial
c har(25) mast er_pert anian id_industri
mast er_jenis_indus tri
gid3
serial
id_kelurahan
c har(25)
c har(25) nama_indus tri
c har(25) id_pert anian serial nama_produk si
id_kelurahan
char(25)
id_prod_pertanian
c har(25)
id_indus tri1
char(25)
bany ak_produksi
c har(25)
nama_indus tri
char(25)
tanggal
c har(25) nama_tanaman char(25)
the_geom
geometry
bulan
c har(25)
c har(25)
bulan
char(25)
mast er_jalan
tahun
char(25)
gid2 serial
mast er_objek_wis ata
nm_jln char(50)
gid4
s erial
the_geom geometry
nmobjek
c har(50)
nm_k elurahan
c har(50)
mast er_tanam_modal
gambar
c har(100)
kode serial
nama_inv estor char(30) mast er_f as ilit as
alamat _inv es tor char(40) gid1
the_geom
geometry
desk rips i
tex t
no_telepon char(13) id
s erial
mast er_adminis trasi
kat egori
c har(100)
kec amat an char(40) k et erangan
jumlah_modal char(14) the_geom
nm_k elura
char(20)
status char(40)
nama_kec
char(20)
ket erangan text
id_kec
smallint
maat er_user1
mast er_berita id_kategori_objek
mast er_objek
id_kel
smallint
id_us er
serial
id_berita s erial jnobjek
serial
the_geom
geometry
pass word
char(50)
char(25)
user_nam e
char(100)
id_kategori integer
char(100)
judul text
lev el
char(5)
is i_berita text gambat
c har(100)
mast er_prof il
tanggal c har(25)
id_prof il
serial
prof il
mast er_hubungi
is i_prof il
text
id_hubungi
serial
mast er_kategori_berita
nama
id_kategori1 integer
char(100) kat egori char(100)
char(50)
char(100) inf o_indus tri
s ubjek
inf o_kelurahan
pesan
text
id_kelurahan1 char(25)
tanggal
char(25)
nama_industri1 char(25)
id_keurahan
char(25)
alamat char(100)
jumah_penduduk
char(25)
k ary awan char(25)
bek erja
char100
produk _hasil char(25)
pengangguran
char(25)
s arjana
char(25)
inf o_pencaharian
produk _perhari char(25)
s lta
char(25)
id_keurahan1
char(25)
pemas aran char(25)
Gambar 3.7 Entity Relationship Diagram (ERD)
3.4 Desain Database
Dalam pembuatan program ini dibutuhkan desain database untuk menyimpan data yang akan digunakan dalam proses sistem informasi geografis profli daerah Kota Blitar. Desain database ini menjelaskan tabel-tabel dan field-field yang digunakan. Berikut adalah tabel yang diguakan untuk proses Sistem Informasi Geografis Profil Daerah Kota.
1. Tabel Master Administrasi
Tabel 3.1 Tabel Master Administrasi
No Nama Field
Type Data
Menyimpan kode sebagai primary key dan unik untuk kode no urut
Menyimpan data area 3. nm_kelura
2. Area
numeric
Menyimpan data kelurahan 4. nama_kec
char(20)
Menyimpan data kecamatan 5. id_kec
char(20)
Menyimpan kode letak kecamatan 6. id_kel
smallint
Menyimpan kode letak kelurahan 7. the_geom
smallint
Geometry
Menyimpan data titik poligon
2. Tabel Master Berita
Tabel 3.2 Tabel Master Berita
No Nama Field
Type Data
Fungsi
1. id_berita
serial
Menyimpan kode sebagai primary key dan unik untuk kode berita
2. id_kategori
integer
Menyimpan kode untuk membedakan setiap kategori
3. Judul
Menyimpan data dari judul berita 4. isi_berita
text
Menyimpan data isi berita 5. Gambar
text
Menyimpan data gambar 6. Tanggal
char (100)
char (14)
Menyimpan data tanggal
3. Tabel Master Fasilitas
Tabel 3.3 Tabel Master Fasilitas
No Nama Field
Type Data
Menyimpan kode sebagai primary key dan unik untuk kode fasilitas
Menyimpan dataid 3. keterangan
2. Id integer
char (25)
Menyimpan data keterangan fasilitas
4. the_geom
geometry
Menyimpan data titik poligon
4. Tabel Master Hubungi
Tabel 3.4 Tabel Master Hubungi
No Nama Field
Type Data
Fungsi
1. id_hubungi
serial
Menyimpan kode sebagai primary key dan unik untuk kode hubungi
Menyimpan data nama 3. Email
2. Nama
char (50)
Menyimpan data email 4. Subjek
char (100)
Menyimpan data subjek 5. Pesan
char (100)
Menyimpan data text 6. Tanggal
text
char (14)
Menyimpan data tanggal
5. Tabel Master Jalan
Tabel 3.5 Tabel Master Jalan
No Nama Field
Type Data
Menyimpan kode sebagai primary key dan unik untuk kode jalan
2. nm_jln
Menyimpan data nama jalan 3. the_geom
char(50)
geometry
Menyimpan data titik poligon jalan
6. Tabel Master Jenis Industri
Tabel 3.6 Tabel Master Jenis Industri
No Nama Field
Type Data
Fungsi
1. id_industri
char(25)
Menyimpan kode sebagai primary key dan unik untuk kode jenis industri
2. nama_industri
char(25)
Menyimpan data nama jenis industri
3. nama_produksi
char(25)
Menyimpan data nama jenis produksi
7. Tabel Master Jumlah Industri
Tabel 3.7 Tabel Master Jumlah Industri
No Nama Field
Type Data
Menyimpan kode sebagai primary key dan unik untuk kode jumlah industri
2. id_kelurahan
Menyimpan data kelurahan 3. id_industri
char(25)
Menyimpan data jumlah industri 4. nama_industri
char(25)
char(25)
Menyimpan data nama jumlah industri
5. the_geom
geometry
Menyimpan data titik poligon jumlah industri
6. tanggal
Menyimpan data tanggal 7. bulan
char (25)
Menyimpan data bulan 8. tahun
char (25)
char (25)
Menyimpan data tahun
8. Tabel Master Kategori Berita
Tabel 3.8 Tabel Master Kategori Berita
No Nama Field
Type Data
Fungsi
1. id_kategori
integer
Menyimpan kode sebagai primary key dan unik untuk kode kategori berita
2. kategori
char(100)
Menyimpan data nama kategori berita
9. Tabel Master Pertanian
Tabel 3.9 Tabel Master Pertanian
No Nama Field
Type Data
Fungsi
1. id_pertanian
serial
Menyimpan kode sebagai primary key dan unik untuk kode pertanian
2. nama_tanaman
char(25)
Menyimpan data nama tanaman pertanian
10. Tabel Master Produksi Pertanian Tabel 3.10 Tabel Master Produksi Pertanian
No Nama Field
Type Data
Fungsi
1. id_produksi
Serial
Menyimpan kode sebagai primary key dan unik untuk kode produksi pertanian
2. id_kelurahan
Menyimpan data nama kelurahan 3. id_pertanian
char(25)
Menyimpan data nama pertanian 4. banyak_produksi
char(25)
Menyimpan data nama produksi 4. tanggal
char(25)
Menyimpan data nama tanggal 6 bulan
char(25)
Menyimpan data nama bulan 7. tahun
char(25)
char(25)
Menyimpan data nama tahun
11. Tabel Master Profil
Tabel 3.11 Tabel Master Profil
No Nama Field
Type Data
Fungsi
1. id_profil
serial
Menyimpan kode sebagai primary key dan unik untuk kode profil
2. profil
Menyimpan data profil 3. gambar
char(100)
Menyimpan data hambar 4. isi_profil
char(100)
text
Menyimpan data isi profil
12. Tabel Master Objek
Tabel 3.12 Tabel Master Objek
No Nama Field
Type Data
Fungsi
1. id_kategori
serial
Menyimpan kode sebagai primary key dan unik untuk kode objek
2. jnobjek
char(25)
Menyimpan data objek
13. Tabel Master Objek Wisata
Tabel 3.13 Tabel Master Objek Wisata
No Nama Field
Type Data
Menyimpan kode sebagai primary key dan unik untuk kode objek wisata
2. nmobjek
char(50)
Menyimpan data jenis objek wisata
3. nm_kelurahan
Menyimpan data nama kelurahan 4. gambar
char(50)
char(50)
Menyimpan data gambar objek wisata
5. the_geom
geometry
Menyimpan data titik objek wisata
6. deskripsi
text
Menyimpan data deskripsi objek wisata
7. kategori
char(20)
Menyimpan data kategori
14. Tabel Master User1
Tabel 3.14 Tabel Master User1
No Nama Field Type Data Fungsi 1. id_user
serial
Menyimpan kode sebagai primary key dan unik untuk kode id user
2. Password
Menyimpan data password 3. user_name
char(50)
Menyimpan data user name 4. Email
char(100)
Menyimpan data email 5. Level
char(100)
char(5)
Menyimpan data level
15. Tabel Master tanam modal Tabel 3.15 Tabel Master tanam_modal
No Nama Field Type Data Fungsi 1. kode
serial
Menyimpan kode sebagai primary key dan unik untuk kode id user
2. nama_investor
char(30)
Menyimpan data nama investor
3. alamat_investor
Menyimpan data alamat 4. no_telepon
char(40)
Menyimpan data telepon 5. Kecamatan
char(13)
char(40)
Menyimpan data kecamatan yang dipilih investor
6. jumlah_modal
char(14)
Menyompan data jumlah modal yang ditanam
7. Status
char(40)
Menyimpan data status pengiriman uang
8. Keterangan
text
Menyimpan data keterangan
16. Master info industri Tabel 3.16 Tabel Master info_industri
No Nama Field Type Data Fungsi 1. id_kelurahan
char(25)
Menyimpan kode sebagai primary key dan unik untuk kode id kelurahan
2. nama_industri
char(25)
Menyimpan data nama industri
Menyimpan data alamat 4. karyawan
3. alamat
char(100)
Menyimpan data karyawan 5. produk_hasil
char(25)
char(25)
Menyimpan data produk hasil
6. produk_perhari
char(25)
Menyompan data prduk perhari
7. pemasaran
char(255)
Menyimpan data pemasaran
17. Master info kelurahan Tabel 3.17 Tabel Master info_kelurahan
No Nama Field Type Data Fungsi 1. id_kelurahan
char(25)
Menyimpan kode sebagai primary key dan unik untuk kode id kelurahan
2. jumah penduduk
Menyimpan data penduduk 3. bekerja
char(25)
char(100)
Menyimpan data penduduk yang bekerja
4. pengangguran
char(25)
Menyimpan data pengangguran
5. sarjana
char(25)
Menyimpan data penduduk sarjana
6. Slta
char(25)
Menyimpan data penduduk slta
7. Sltp
char(25)
Menyimpan data penduduk sltp
8. Sd
char(25)
Menyimpan data penduduk sd
18. Master info pencaharian Tabel 3.18 Tabel Master info pencaharian
No Nama Field Type Data Fungsi 1. id_kelurahan
char(25)
Menyimpan kode sebagai primary key dan unik untuk kode id kelurahan
2. Pencaharian
char(25)
Menyimpan data pencaharian
3. Jumlah
char(100)
Menyimpan data semua jumah penduduk
BAB IV
HASIL DAN PEMBAHASAN
4.1 Implementasi
Bab ini akan membahas tentang pengujian dan analisa hasil program yang telah dibuat. Tujuan dari pegujian ini adalah untuk mengetahui apakah aplikasi yang telah dibuat sesuai dengan perancangannya. Selain itu juga untuk mengetahui detail jalannya aplikasi serta kesalahan yang ada untuk pengembangan dan perbaikan lebih lanjut. Pada proses pengembangan aplikasi SIG Profil Daerah ini membutuhkan beberapa peralatan, baik berupa perangkat keras maupun perangkat lunak.
4.1.1 Ruang Lingkup Perangkat Keras
Dalam pengembangan SIG Profil Daerah Kota Blitar ini menggunakan perangkat keras Laptop Acer Aspire 5052ANWXMi dengan spesifikasi sebagai berikut :
1. Prosesor AMD Turion (2,2Ghz) 2. RAM 1536 MB 3. Hardisk Dengan Kapasitas 80 GB 4. Monitor 14,2” WXGA Acer Crystal Brite LCD resolusi 1280 x 800 pixels. 5. Keyboard 6. Mouse USB
4.1.2 Ruang Lingkup Perangkat Lunak
Perangkat lunak yang digunakan untuk pengembangan aplikasi ini antara lain : 1. Sistem Operasi Windows XP Profesional SP2
2. Chameleon 2.5 3. P H P 4. MapSever 1.6 5. Apache 2.2.7 6. PostgreSQL 8.2.5 7. MapLab 8. Macromedia Dreamweaver CS3
4.1.3 Implementasi Peta
Website sistem informasi geografis ini menggunakan framework Chameleon sebagai media untuk menampilkan peta. Untuk menampilkan peta dari ArcView pada web diperlukan proses konversi data terlebih dahulu. Data yang berhubungan dengan pemetaan merupakan hasil konfersi dari data tipe SHP yang berasal dari ArcView ke tag SQL dengan bantuan aplikasi shp2pgsql. Data peta dari ArcView tersebut minimal terdiri dari tiga data peta yaitu *.shp, *.shx, dan *.dbf. Sehingga data dari ArcView akan tersimpan dalam bentuk taq SQL dan semua data peta yang beripe poin, line dan polygon akan di rubah kedalam format WKB (Well Known Binary). Proser konversi data melalui command prompt dengan cara masuk terlebih dahulu ke folder “bin” pada PosgreSQL yang ada di program file dan sebelum di konversi copy terlebih dahulu file peta dari ArcView ke folder bin.
Gambar 4.1 Diagram Konversi Data
4.1.4 Implementasi Desain Interface
Pada sub bab ini akan dilakukan implementasi dari desain interface yang telah dibahas pada bab 3. Berdasarkan desain interface yang telah dibahas pada bab 3, maka akan dibagi menjadi dua bagian yaitu halaman utama dan halaman sysadmin .
1. Halaman Utama Hasil implementasi interface pada halaman utama berdasarkan perancangan pada bab 3 seperti terlihat pada gambar 4.2 dibawah ini.
Gambar 4.2 Halaman Utama
Halaman utama website ini adalah untuk menampilkan berbagai menu informasi yang ada dalam sistem informasi geografis profli daerah Kota Blitar. Pada halaman ini terdiri dari beberapa menu utama antara lain:
a. Beranda Halaman ini adalah halaman yang pertama kali muncul ketika user maupun admin mengakses website, yang berisi tentang tujuan dan manfaat dari sistem informasi geografis profil daerah Kota Blitar.
b. Profil Tombol profil ini memuat tentang gambaran umum profil daerah kota yang didalamnya berisi gambar gedung pemerintahan kota dan penjelasan letak Kota Blitar, seperti pada gambar 4. 3 dibawah ini.
Gambar 4. 3 Profil Kota Gambar 4. 3 Profil Kota
4 dibawah ini.
Gambar 4. 4 Berita
d. Contact User Halaman ini menyajikan halaman pesan untuk pengguna dan tidak perlu melakukan proses login, dimana pesan tersebut langsung masuk ke admin seperti pada gambar 4. 5 dibawah ini.
Gambar 4. 5 Contact User
e. Login
Gambar 4. 6 Login
Tombol login hanya dapat diakses oleh sysadmin,semua data yang ada pada web ini di olah, di kontrol oleh admin melalui tombol ini.
f. Pertanian
Gambar 4. 7 Aplikasi Pertanian
Untuk melihat data pertanian Kota Blitar maka user harus mengisi form pertanian dengan lengkap seperti yang ada pada gambar 4. 7 aplikasi pertanian di atas.
g. Pariwisata
Gambar 4. 8 Aplikasi Pariwisata
Aplikasi Pariwisata merupakan form yang digunakan untuk melihat wisata-wisata setiap kecamatan ataupun kelurahan yang ada di Kota Blitar. Pengguna dapat langsung mengklik nama kelurahan.
h. Industri
Gambar 4. 9 Aplikasi Industri
Dalam aplikasi industri ini, sistem kerja program hampir sama dengan aplikasi petanian yaitu user harus mengisi form pertanian dengan lengkap seperti yang ada pada gambar 4. 9 aplikasi industri di atas.
Untuk melihat keterangan lebih lengkap mengenai pertumbuhan industri dan penduduk setempat, dapat dilihat seperti pada gambar di bawah ini.
Gambar 4. 10 Perkembangan Industri Dan Penduduk
Analisis perkembangan industri ini berdasarkan informasi tiap-tiap kelurahan, industri yang ada di kelurahan tersebut di data mulai dari nama, alamat, jumlah pekerja, produksi per hari, dan pemasarannya.
Penduduk yang ada di kelurahan tersebut pun juga di data mulai dari banyaknya penduduk, penduduk yang bekerja dan pengangguran kemudian di prosentase mana yang lebih manyak. Menampilkan mata pencaharian penduduk seperti tani, niaga, dan guru. Menghitung tenaga terdidik dari penduduk yang tidak berpendidikan, SD, SLTP, SLTA, dan Sarjana.
i. GIS (Peta Kota Blitar)
Gambar 4. 11 GIS Kota Blitar
Pada halaman ini memuat tampilan peta Kota Blitar, yang didalamnya terdapat semua informasi tentang profil kota, fasilitas, jalan kota, industri dan objek wisata. Untuk membedakan setiap legend pada peta maka untuk fasilitas menggunakan tanda gedung, pabrik dengan tanda bulet silang merah, dan untuk objek wisata menggunakan bulet warna hijau, seperti pada gambar 4.11 di atas.
Untuk melihat peta lebih terperinci, klik tanda detail kemudian pilih bulet daerah yang ada pada peta, seperti petunjuk gambar di bawah ini.
detail
Gambar 4. 12 Detail Peta
Gambar 4. 13 Keterangan Peta
Dibawah ini merupakan source program untuk menampilkan peta umum Sistem Informasi Geografis profil daerah Kota Blitar.
<?php
include( "../../htdocs/chameleon.php" );
$szTemplate = "./blitar.php"; $szMapFile = "../map/blitar.map";
class SampleApp extends Chameleon
function SampleApp() {
parent::Chameleon();
$this->moMapSession = new MapSession_RW; $this->moMapSession->setTempDir(
Di bawah ini merupakan source untuk manampilkan layer fasilitas.
LAYER
NAME "Fasilitas" GROUP "Point"
STATUS OFF
DATA "the_geom FROM fasilitass USING UNIQUE gid"
TYPE POINT CONNECTIONTYPE POSTGIS CONNECTION "user=postgres dbname=blitar
host=localhost port=5432 password=root"
LABELITEM "keterangan"
PROJECTION "proj=latlong"
END CLASS
NAME "blitar"
TEMPLATE "ttt_query.html"
LABEL
TYPE TRUETYPE FONT "sans"
Di bawah ini merupakan source untuk manampilkan layer industri.
LAYER
NAME "Pabrik/Industri" GROUP "Point" STATUS DEFAULT DATA "the_geom FROM jumlah_industri USING UNIQUE gid"
TYPE POINT CONNECTIONTYPE POSTGIS CONNECTION "user=postgres dbname=blitar host=localhost
port=5432 password=root"
LABELITEM "nama_industri" PROJECTION
"proj=latlong"
END CLASS
NAME "industri"
TEMPLATE "ttt_query.html"
LABEL
TYPE TRUETYPE
Di bawah ini merupakan source untuk manampilkan layer objek wisata.
LAYER
NAME "Objek Wisata"
GROUP "point"
STATUS ON DATA "the_geom FROM tmobjekwst USING UNIQUE gid" TYPE POINT
CONNECTIONTYPE POSTGIS
CONNECTION "user=postgres dbname=blitar
host=localhost port=5432 password=root" LABELITEM "nmobjek"
METADATA
"DESCRIPTION" "Wisata" "RESULT_FIELDS" "nmobjek"
"GROUP" "point"
"LAYER" "Wisata" END PROJECTION
"proj=latlong"
END
CLASS
Di bawah ini merupakan source untuk manampilkan layer peta blitar.
LAYER
NAME "peta blitar"
GROUP "poligon" STATUS ON DATA "the_geom FROM administrasi USING UNIQUE gid"
TYPE POLYGON
CONNECTIONTYPE POSTGIS
CONNECTION "user=postgres dbname=blitar host=localhost port=5432 password=root"
LABELITEM "nm__kelura" METADATA
"DESCRIPTION" "peta_blitar"
"GROUP" "polygon"
"LAYER" "peta_blitar"
END PROJECTION
"proj=latlong"
END
CLASS CLASS
Gambar 4. 14 Tanam Modal
2. Halaman Sysadmin Pada halaman ini hanya bisa di akses oleh administrator dan petugas saja, Hasil implementasi interface halaman sysadmin berdasarkan perancangan pada bab 3 seperti terlihat pada gambar 4.15 di bawah ini.
Gambar 4.15 Halaman Sysadmin
4.2 Uji Coba Sistem
Pengujian dilakukan untuk mengetahui apakah aplikasi yang telah dibangun dapat berjalan dengan baik dan memenuhi spesifikasi yang telah ditentukan. Sebelum melakukan uji coba sistem, terlebih dahulu mengumpulkan data-data hasil survey di lapangan yang selanjutnya dilakukan uji coba program dengan memasukkan data-data yang ada.
4.2.1 Pengujian Sistem Secara Umum
Sebelum memulai untuk menjalankan aplikasi yang telah dibuat, karena untuk uji coba aplikasi ini dijalankan di komputer lokal maka kita harus memastikan bahwa server lokal MapServer 2.2.7 telah aktif dan berjalan dengan normal. Hal ini sangat penting karena aplikasi hanya dapat jalan jika web sever lokal juga jalan (aktif). Setelah web server telah aktif, maka kita buka browser
Internet Explore atau browser yang lainnya dan kita ketikkan alamat URL sebagai berikut : http://localhost/blitar . Jika setelah mengakses halaman tersebut didapatkan tampilan halaman utama, artinya sistem dapat berjalan dengan lancar, kemudian dapat dilanjutkan dengan pengujian program.
4.2.2 Functional Testing
Setelah dilakukan pengujian tehadap komponen-komponen yang mendukung jalannya aplikasi ini, selanjutya dilakukan pengujian terhadap fungsi atau kegunaan dari semua bagian dalam aplikasi. Pengujian ini dilakukan terhadap fungsi-fungsi pemrosesan data, diantaranya adalah :
1. Pemrosesan Input Hasil Survei Pertanian Pada proses ini akan dilakukan uji coba terhadap fungsi input hasil survei
pertanian yang kemudian disimpan dalam tabel analisis pertanian. Pengujian dilakukan dengan memasukkan variable yang telah disediakan, setelah diisi lengkap kemudian klik tombol “Simpan” untuk menyimpanya. Proses input hasil survei pertanian dapat dilihat pada gambar 4.16 di bawah ini.
Gambar 4.16 Input Hasil Survei Pertanian
Setelah data di masukkan maka akan muncul halaman baru seperti pada gambar grafik 4.17 di bawah ini:
Gambar 4.17 Grafik Pertanian
2. Pemrosesan Input Hasil Survei Pariwisata
Gambar 4.18 Input Hasil Survei Pariwisata
Pengujian dilakukan dengan memasukkan variable yang telah disediakan, setelah diisi lengkap kemudian klik tombol “Simpan” untuk menyimpanya. Proses Pengujian dilakukan dengan memasukkan variable yang telah disediakan, setelah diisi lengkap kemudian klik tombol “Simpan” untuk menyimpanya. Proses
Gambar 4.19 Print Pariwisata
3. Pemrosesan Input Hasil Survei Industri Proses ini akan dilakukan uji coba terhadap fungsi input hasil survei
industri yang kemudian disimpan dalam tabel analisis industri. Pengujian dilakukan dengan memasukkan variable yang telah disediakan, setelah diisi lengkap kemudian klik tombol “Simpan” untuk menyimpanya. Proses input hasil survei industri dapat dilihat pada gambar di bawah ini:
Gambar 4.20 Input Hasil Survei Industri
Gambar 4.21 Grafik Industri
Sysadmin juga memiliki form untuk input anaisis pertumbuhan industri yang ada di tiap kelurahan, tingkat pertumbuhan, dan pendidikan penduduk yang ada di wiayah tersebut seperti pada urutan gambar di bawah ini.
Gambar 4.22 Data Jenis Industri
Gambar 4.23 Aset Pertumbuhan Industri
Gambar 4.24 Data Informasi Industri
Gambar 4.25 Data Informasi Kelurahan
Gambar 4.26 Data Informasi Pencaharian
4.3 Pembahasan
Sistem Informasi Geografis merupakan aplikasi web yang tergolong baru, sedikit sekali orang yang mengetahui dan membuat aplikasi seperti ini. Karena ilmu seperi ini masih tergolong ilmu yang langka, kami akan menyampaikan ilmu ini sesuai dengan hadist Nabi yaitu :
, yang artinya “sampaikan dariku walau 1 ayat” , diriwayatkan oleh (HR. Tirmidzi). Penelitian dan pembuatan aplikasi ini dibuat agar para masyarakat awam setidaknya tahu tentang ilmu seperti ini, meskipun hanya dasarnya saja.
Dari hasil yang telah diperoleh dari penelitian ini, aplikasi Sistem Informasi Geografis Profil Daerah kota Blitar nantinya akan lebih mempermudah masyarakat ataupun Pemerintah Daerah
dalam memonitoring dan mengembangkan Kota Blitar menjadi lebih baik. Kemudahan yang didapat yaitu masyarakat dapat melihat semua profil kota tanpa harus datang ke tempat yang ingin dilihat, sementara Pemerintah Daerah dapat lebih mudah mengontrol dalam perkembangan dan kemajuan kota tanpa turun ke lapangan langsung. Senada dalam memonitoring dan mengembangkan Kota Blitar menjadi lebih baik. Kemudahan yang didapat yaitu masyarakat dapat melihat semua profil kota tanpa harus datang ke tempat yang ingin dilihat, sementara Pemerintah Daerah dapat lebih mudah mengontrol dalam perkembangan dan kemajuan kota tanpa turun ke lapangan langsung. Senada
I5 9G H"
8G B G >
8C G “Allah menghendaki kemudahan bagimu, dan tidak menghendaki kesukaran
(JB
bagimu. Dan hendaklah kamu mencukupkan bilangannya dan hendaklah kamu mengagungkan Allah atas petunjuk-Nya yang diberikan kepadamu, supaya kamu bersyukur.” (QS Al Baqarah 2: 185)
Ayat di atas menggambarkan bagaimana kemudahan itu dianjurkan oleh Allah SWT kepada manusia. Contoh lain dalam kaitannya dengan ayat diatas yaitu pada pengembangan aplikasi ini nantinya diharapkan dapat lebih rinci, nyata dan lebih baik. Sesuai penjelasan di atas, pengembangan aplikasi ini juga terkait dengan sosok manusia ulu al-albab. Sosok manusia ulu al-albab adalah orang yang mengedepankan dzikir, fikir dan amal shaleh. Serta dapat diartikan juga manusia yang berpandangan bahwa tidak terdapat kekuatan dimuka bumi ini selain Allah SWT. Pengertian ini tertuang dalam firman Allah SWT dalam Al- Qur’an Surat Ali ‘imran Ayat 190-191 yang berbunyi :
4M (? D> L (
$ )# : " - %
)# ! 'G%
I5 4/ < ! D;=
“Sesungguhnya dalam penciptaan langit dan bumi, dan silih bergantinya malam dan siang terdapat tanda-tanda bagi orang-orang yang berakal. (191). (yaitu) orang-orang yang mengingat Allah sambil berdiri atau duduk atau dalam keadaan berbaring dan mereka memikirkan tentang penciptaan langit dan bumi (seraya berkata): "Ya Tuhan Kami, Tiadalah Engkau menciptakan ini dengan sia- sia, Maha suci Engkau, Maka peliharalah Kami dari siksa neraka.” (QS Al Baqarah 2: 185)
Memahami arti sosok manusia ulu al-albab dan arti ayat diatas, seorang manusia ulu al-albab dalam menghadapi persoalan hidup tentunya tidak akan ceroboh. Manusia tersebut akan melihat persoalan itu dari berbagai segi keilmuan atau bisa diartikan mengklasifikasikannya dan mencari rujukan sumber hukum pada Al-Qur’an dan Hadist. Dalam hal ini, Sistem Informasi Geografis merupakan pencapaian dari manusia mau berfikir, berusaha dengan petunjuk Al-Qur’an dan Hadist sehingga dalam melihat suatu daerah cukup dengan aplikasi seperti ini.
BAB V PENUTUP
5.1 Kesimpulan
Penelitian yang dilakukan di Kantor Badan Pemerintahan Dan Pengembangan Daerah Kota Blitar (BAPPEDA), bahwa dengan adanya aplikasi Sistem Informasi Geografis Profil Daerah Kota ini, akan mempermudah untuk menginformasikan dan memonitoring semua daerah yang ada. Karena dengan peta digital dalam bentuk database akan lebih mudah diolah dari pada peta digital yang dalam bentuk gambar digital biasa
Dari aplikasi ini nantinya dapat menampilkan peta Kotamadya Blitar, yang didalamnya terdapat semua informasi tentang profil, potensi kota sehingga lebih mudah dalam melihat perkembangan setiap kelurahan di kawasan kota.
5.2 Saran
Penulis tahu dalam aplikasi Sistem Informasi Geografis untuk mengetahui Profil Daerah Kota Blitar ini masih banyak terdapat kelemahan dan kekurangan. Oleh sebab itu penulis mengharapkan untuk penelitian selanjutnya sistem ini dapat dikembangkan menjadi lebih bermanfaat dan lebih baik lagi.
DAFTAR PUSTAKA
Abdullah bin Muhammad. 2006.Tafsir Ibnu Kasir. Jakarta: Pustaka Iman Syafi’i. Allamah Kamal Faqih dan Tim Ulama. 2004. Tafsir Nurul Quran: Sebuah Tafsir
Sederhana Menuju Cahaya Al-Quran . Jakarta: Al-Huda Al-Sheikh, Bin Ishak, Bin Abdurahman, Bin Muhammad, Abdullah, 2003, Tafsir Ibnu Katsir. Pustaka Iman Asy-Syafi’i. Muhardin. Endy, 2003, PHP Programming Fundamental dan MySQL Fundamental , ArtiVisi Intermedia. Nuryadin, Ruslan. 2005. Panduan MapServer. Bandung: Informatika. Pendit, Nyoman S. 2003. Ilmu Pariwisata sebuah pengantar perdana. Jakarta:
PT. Pradnya Pramita. Penyusun, Tim. 2008. DDA Blitar dalam angka. Blitar: Bappeda. Prahasta, Eddy. 2002. Tutorial ArcView. Bandung: Informatika. Prahasta, Eddy. 2006. Membangun Aplikasi Web-based GIS Dengan MapSever.
Bandung: Informatika. Sidik, Betha. 2001. Pemprograman Web Dengan PHP. Bandung:Informatika. Syafii, M, 2005. Aplikasi Database Dengan PHP 5 MySQL PostgreSQL Oracle.
Yogyakarta: Andi Offesed. Tim Penyusun. 2005. Apliksi Server Database Postgresql. Jakarta:Dian Rakyat Utami, Ema. 2006. RDBMS dengan PostgreSQL di GNU/Linux. Yogyakarta:
Andi Offsed.
LAMPIRAN FILE MAP PETA KOTA BLITAR
MAP NAME "Blitar" STATUS ON EXTENT 624753.5 9100392 632170.291798 9109377 SIZE 575 475 #SHAPEPATH "../blitar" SYMBOLSET "../etc/symbols.sym" FONTSET "../etc/fonts.txt" IMAGECOLOR 255 255 255
UNITS DD WEB IMAGEPATH "/ms4w/tmp/ms_tmp/" IMAGEURL "/ms_tmp/" METADATA END
END
REFERENCE STATUS ON IMAGE "images/index.jpg" SIZE 125 100 EXTENT 624753.5 9100392 632170.291798 9109377 COLOR -1 -1 -1 OUTLINECOLOR 45 0 199
END QUERYMAP
STATUS ON COLOR 73 0 221 STYLE HILITE END
PROJECTION "proj=latlong" ""
END LEGEND
STATUS ON KEYSIZE 18 12 LABEL
TYPE BITMAP SIZE MEDIUM COLOR 0 0 89
END END SCALEBAR
STATUS ON COLOR 255 255 255 OUTLINECOLOR 0 0 0 BACKGROUNDCOLOR 0 0 0 IMAGECOLOR 255 255 255 UNITS KILOMETERS INTERVALS 5 SIZE 150 5 LABEL
SIZE SMALL
COLOR 0 0 0 END END
LAYER NAME "peta blitar" GROUP "poligon" STATUS ON DATA "the_geom FROM administrasi USING UNIQUE gid" TYPE POLYGON CONNECTIONTYPE POSTGIS CONNECTION "user=postgres dbname=blitar host=localhost
port=5432 password=root" LABELITEM "nm__kelura" METADATA
"DESCRIPTION" "peta_blitar" "GROUP" "polygon" "LAYER" "peta_blitar"
END PROJECTION
"proj=latlong" END CLASS
NAME "peta_blitar" LABEL TYPE TRUETYPE FONT "sans" SIZE MEDIUM MINSIZE 8 MAXSIZE 9
COLOR 255 50 0 POSITION AUTO END STYLE
COLOR 255 200 200 OUTLINECOLOR 0 200 200 SIZE 5
END END END
LAYER NAME "jalan" GROUP "line" STATUS OFF DATA "the_geom FROM jalan USING UNIQUE gid" TYPE LINE CONNECTIONTYPE POSTGIS CONNECTION "user=postgres dbname=blitar host=localhost
port=5432 password=root" LABELITEM "nm_jln" PROJECTION
"proj=latlong" END CLASS
NAME "jalan" STYLE
COLOR 0 0 0 END END END
LAYER NAME "Objek Wisata" GROUP "point"
STATUS ON DATA "the_geom FROM tmobjekwst USING UNIQUE gid" TYPE POINT CONNECTIONTYPE POSTGIS CONNECTION "user=postgres dbname=blitar host=localhost
port=5432 password=root" LABELITEM "nmobjek" METADATA
"DESCRIPTION" "Wisata" "RESULT_FIELDS" "nmobjek" "GROUP" "point" "LAYER" "Wisata"
END PROJECTION
"proj=latlong" END CLASS
NAME "Wisata" TEMPLATE "ttt_query.html"
LABEL TYPE TRUETYPE FONT "sans" SIZE MEDIUM MINSIZE 7 MAXSIZE 8 POSITION AUTO
END STYLE
SYMBOL 2 COLOR 100 255 0 SIZE 20 MINSIZE 12 MAXSIZE 13
END END END
LAYER NAME "Pabrik/Industri" GROUP "Point" STATUS DEFAULT DATA "the_geom FROM jumlah_industri USING UNIQUE gid" TYPE POINT CONNECTIONTYPE POSTGIS CONNECTION "user=postgres dbname=blitar host=localhost
port=5432 password=root" LABELITEM "nama_industri" PROJECTION
"proj=latlong" END CLASS
NAME "industri" TEMPLATE "ttt_query.html" LABEL
TYPE TRUETYPE FONT "sans" SIZE MEDIUM MINSIZE 7 MAXSIZE 8 POSITION AUTO
END STYLE
SYMBOL 3 COLOR 255 0 0 SIZE 10 MINSIZE 12 MAXSIZE 13
END END END
LAYER
NAME "Fasilitas" GROUP "Point" STATUS OFF DATA "the_geom FROM fasilitass USING UNIQUE gid" TYPE POINT CONNECTIONTYPE POSTGIS CONNECTION "user=postgres dbname=blitar host=localhost
port=5432 password=root" LABELITEM "keterangan" PROJECTION
"proj=latlong" END CLASS
NAME "blitar" TEMPLATE "ttt_query.html" LABEL
TYPE TRUETYPE FONT "sans" SIZE MEDIUM MINSIZE 8 MAXSIZE 9 POSITION AUTO
END STYLE
SYMBOL 4 COLOR 110 0 0 SIZE 10 MINSIZE 12 MAXSIZE 13
END END END
END