perancangan sistem informasi pemetaan lokasi spbu di kota...
TRANSCRIPT
i
Perancangan Sistem Informasi Pemetaan Lokasi SPBU di Kota
Semarang Berbasis Web Menggunakan Google Maps API
SKRIPSI
Diajukan kepada
Fakultas Teknologi Informasi
untuk memperoleh Gelar Sarjana Komputer
Oleh:
Micky Olivia
NIM: 672009073
Program Studi Teknik Informatika
Fakultas Teknologi Informasi
Universitas Kristen Satya Wacana
Salatiga
April 2015
ii
Halaman Persetujuan
iii
Halaman Pengesahan
iv
v
vi
Pernyataan
Artikel Ilmiah berikut ini :
Judul : Perancangan Sistem Informasi Pemetaan Lokasi SPBU di
Kota Semarang Berbasis Web Menggunakan Google Maps
API
Pembimbing : Ramos Somya, S.Kom., M.Cs.
adalah benar hasil karya saya :
Nama : Micky Olivia
NIM : 672009073
Saya menyatakan tidak mengambil sebagian atau seluruhnya dari hasil karya orang
lain kecuali sebagaimana yang tertulis pada daftar pustaka.
Pernyataan ini dibuat dengan sebenar-benarnya sesuai dengan ketentuan yang berlaku
dalam penulisan artikel ilmiah.
Salatiga, 6 April 2015
Micky Olivia
vii
Prakata
Puji dan syukur pada Tuhan Yesus Kristus Pemilik segala makhluk dan bangsa
yang kasih-Nya telah membimbing penulisan sehingga dapat menyelesaikan artikel
ilmiah dengan judul “Perancangan Sistem Informasi Pemetaan Lokasi SPBU di
Kota Semarang Menggunakan Google Maps API”. Artikel ilmiah ini disusun
untuk memenuhi persyaratan dalam memperoleh gelar Sarjana Komputer pada
Program Studi Teknik Informatika, Fakultas Teknologi Informasi, Universitas
Kristen Satya Wacana Salatiga.
Tesusunnya artikel ilmiah ini tidak lepas dari bantuan dan dukungan berbagai
pihak. Oleh karena itu, penulis ingin menyampaikan ucapan terima kasih kepada:
1. Bapak Dharmaputra T. Palekahelu, M.Pd., selaku Dekan Fakultas Teknologi
Informasi, Universitas Kristen Satya Wacana Salatiga.
2. Bapak Suprihadi, S.Si., M.Kom., selaku Ketua Program Studi Teknik
Informatika, Fakultas Teknologi Informasi, Universitas Kristen Satya Wacana
Salatiga.
3. Bapak Ramos Somya, S.Kom., M.Cs., selaku dosen Pembimbing I atas
kesabaran dalam memberi bimbingan, masukan, motivasi, dan pengarahan
dalam penyusunan artikel ilmiah ini.
4. Seluruh Bapak/Ibu dosen pengajar, staff Tata Usaha, dan karyawan di Fakultas
Teknologi Informasi, Universitas Kristen Satya Wacana Salatiga yang telah
mendidik dan memberikan pengetahuan kepada penulis selama kuliah.
5. Ibunda tercinta, kedua kakakku, dan adikku tersayang yang selalu memberikan
semangat, doa, perhatian, dan kasih sayang yang begitu besar sampai sekarang
dan seterusnya.
viii
6. Sahabat-sahabatku Kristy, Elisabeth, dan Tia yang selalu memberikan semangat
dan pencerahan.
7. Teman-teman Fakultas Teknologi Informasi yang telah memberikan dukungan
dan bantuannya dalam proses pengerjaan skripsi ini.
8. Bapak dan Ibu Kos “Kemiri 1, 7a” yang berperan sebagai orang tua kedua saat
tinggal di Salatiga, serta keluarga kecil 7a yang selalu memberikan nasehat dan
dorongan untuk menyelesaikan skripsi.
9. PT. Pertamina Semarang untuk kesempatan waktu yang diberikan selama
wawancara.
10. Dan semua pihak yang tidak dapat penulis sebutkan satu persatu yang telah
membantu selama penyusunan skripsi.
Penulis menyadari sepenuhnya bahwa dalam penulisan artikel ilmiah ini masih
terdapat kekurangan. Oleh karena itu, penulis mengharapkan saran yang membangun
dari pembaca demi penyempurnaan artikel ilmiah ini.
Akhir kata, penulis berharap semoga laporan artikel ilmiah ini dapat bermafaat
bagi pembaca sekalian.
Salatiga, April 2015
Micky Olivia
vii
Daftar Isi
Halaman Sampul Depan ................................................................................................. i
Halaman Persetujuan ..................................................................................................... ii
Halaman Pengesahan ................................................................................................... iii
Halaman Persetujuan Akses ......................................................................................... iv
Halaman Pernyataan Tidak Plagiat ............................................................................... v
Halaman Pernyataan..................................................................................................... vi
Prakata ......................................................................................................................... vii
Daftar Isi....................................................................................................................... ix
Daftar Tabel ................................................................................................................ xii
Daftar Gambar ............................................................................................................ xiii
Daftar Kode Program .................................................................................................. xv
Daftar Lampiran ......................................................................................................... xvi
Arti Singkatan ........................................................................................................... xvii
Abstrak ..................................................................................................................... xviii
Abstract ...................................................................................................................... xix
Bab 1 Pendahuluan ........................................................................................................ 1
1.1 Latar Belakang ................................................................................................ 1
1.2 Rumusan Masalah ........................................................................................... 2
1.3 Tujuan Penelitian ............................................................................................ 2
1.4 Manfaat Penelitian .......................................................................................... 3
1.5 Batasan Masalah ............................................................................................. 3
1.6 Sistematika penulisan...................................................................................... 3
Bab 2 Tinjauan Pustaka ................................................................................................. 5
2.1 Penelitian Terdahulu ....................................................................................... 5
viii
2.2 Landasan Teori................................................................................................ 6
2.2.1 Konsep Dasar Sistem .......................................................................... 6
2.2.2 Website ................................................................................................ 6
2.2.3 Sistem Informasi Geografis (SIG) ..................................................... 7
2.2.4 Komponen SIG ................................................................................... 8
2.2.4.1 Hardware .............................................................................. 8
2.2.4.2 Software ................................................................................ 8
2.2.4.3 Data ....................................................................................... 9
2.2.4.4 Aplikasi ............................................................................... 10
2.2.4.5 Brainware ........................................................................... 10
2.2.5 HTML ................................................................................................ 10
2.2.6 Peta .................................................................................................... 11
2.2.7 Google Maps ..................................................................................... 12
2.2.8 XML ................................................................................................... 12
2.2.9 JavaScript .......................................................................................... 13
2.2.10 PHP ................................................................................................... 14
Bab 3 Metode Penelitian ............................................................................................. 15
3.1 Metode Pengembangan Sistem ..................................................................... 15
3.2 Analisis Kebutuhan Sistem ........................................................................... 16
3.2.1 Analisis Kebutuhan Perangkat Keras ................................................ 16
3.2.2 Analisis Kebutuhan Perangkat Lunak ............................................... 17
3.3 Desain Prosedur Sistem ................................................................................ 17
3.3.1 Use Case Diagram ............................................................................ 17
3.3.2 Activity Diagram ............................................................................... 19
3.3.3 Sequence Diagram ............................................................................ 21
3.3.4 Class Diagram .................................................................................. 27
3.3.5 Deployment Diagram ........................................................................ 28
3.3.6 Arsitektur Sistem ............................................................................... 29
3.4 Perancangan Tabel Data ............................................................................... 30
ix
3.5 Perancangan Sistem ...................................................................................... 32
3.5.1 Mengintegrasikan Google Maps API pada Halaman Web ................ 32
3.5.2 Menentukan Lokasi SPBU ................................................................ 36
3.5.3 Perancangan Navigasi Aplikasi ........................................................ 36
3.5.3.1 Struktur Navigasi User ....................................................... 36
3.5.3.2 Struktur Navigasi Admin ..................................................... 37
3.6 Desain Antarmuka ........................................................................................ 38
Bab 4 Hasil Penelitian dan Pembahasan ..................................................................... 40
4.1 Antarmuka Sistem ......................................................................................... 40
4.1.1 Antarmuka User ................................................................................ 41
4.1.2 Antarmuka Admin ............................................................................. 48
4.2 Pengujian Sistem ........................................................................................... 51
4.2.1 Pengujian User .................................................................................. 52
4.2.2 Pengujian Admin ............................................................................... 52
4.3 Analisis Hasil Pengujian Sistem ................................................................... 53
Bab 5 Kesimpulan dan Saran ...................................................................................... 56
5.1 Kesimpulan ................................................................................................... 56
5.2 Saran ............................................................................................................. 56
Daftar Pustaka ............................................................................................................. xx
Lampiran ................................................................................................................... xxii
xii
Daftar Tabel
Tabel 3.1 Tabel Login ................................................................................................. 30
Tabel 3.2 Tabel Data Lokasi SPBU ............................................................................ 31
Tabel 4.1 Hasil Pengujian Aplikasi Web User ........................................................... 52
Tabel 4.2 Hasil Pengujian Aplikasi Web Admin ......................................................... 53
Tabel 4.3 Hasil Jawaban Kuesioner............................................................................ 54
xii
Daftar Gambar
Gambar 2. 1 Komponen-Komponen Sistem Informasi Geografis ............................. 8
Gambar 2. 2 Skema Software (Perangkat Lunak) ..................................................... 9
Gambar 3.1 Tahapan Penelitian .............................................................................. 15
Gambar 3.2 Use Case Diagram .............................................................................. 18
Gambar 3.3 Activity Diagram User Mencari Lokasi .............................................. 19
Gambar 3.4 Activity Diagram Melihat Data SPBU ................................................ 20
Gambar 3.5 Activity Diagram Menambah Data SPBU ........................................... 21
Gambar 3.6 Sequence Diagram Melihat Peta SPBU .............................................. 22
Gambar 3.7 Sequence Diagram Mencari Lokasi SPBU ......................................... 22
Gambar 3.8 Sequence Diagram Admin Login ......................................................... 23
Gambar 3.9 Sequence Diagram Admin Mengubah Data SPBU ............................. 24
Gambar 3.10 Sequence Diagram Admin Menambah Data SPBU............................. 25
Gambar 3.11 Sequence Diagram Admin Menghapus Data SPBU ............................ 26
Gambar 3.12 Sequence Diagram Admin Logout ....................................................... 27
Gambar 3.13 Class Diagram Sistem ......................................................................... 28
Gambar 3.14 Deployment Diagram Sistem .............................................................. 29
Gambar 3.15 Arsitektur Sistem ................................................................................. 37
Gambar 3.16 Struktur Navigasi User ........................................................................ 38
Gambar 3.17 Struktur Navigasi Admin ..................................................................... 39
Gambar 4.1 Menu Halaman Beranda ...................................................................... 41
Gambar 4.2 Menu Navigasi Website ....................................................................... 42
Gambar 4.3 Menu Kiri Berita.................................................................................. 43
Gambar 4.4 Menu Cari Lokasi ................................................................................ 43
Gambar 4.5 Menu Kiri Info SPBU .......................................................................... 44
Gambar 4.6 Menu Kontent Beranda........................................................................ 45
xiii
Gambar 4.7 Isi Kontent Peta Cari Lokasi................................................................ 46
Gambar 4.8 Isi Kontent Tabel Cari Lokasi ............................................................. 46
Gambar 4.9 Isi Kontent Menu Daftar SPBU ........................................................... 47
Gambar 4.10 Menu Kontent Info SPBU ................................................................... 48
Gambar 4.11 Halaman Login Admin ......................................................................... 48
Gambar 4.12 Halaman Admin ................................................................................... 49
Gambar 4.13 Menu Data SPBU ................................................................................ 50
Gambar 4.14 Menu Tambah Data Lokasi SPBU ...................................................... 51
xv
Daftar Kode Program
Kode Program 3.1 Google Maps API Key .................................................................. 32
Kode Program 3.2 Perintah untuk Menampilkan Peta ............................................... 33
Kode Program 3.3 Menggunakan Echo PHP untuk Output XML .............................. 33
Kode Program 3.4 Perintah untuk Membuat Titik Koordinat Peta Google Maps ...... 34
Kode Program 3.5 Perintah untuk Load Peta ............................................................. 35
Kode Program 3.6 Perintah untuk Menampilkan Pencarian Lokasi ........................... 35
xvi
Daftar Lampiran
Lampiran 1 Daftar SPBU Kota Semarang .............................................................. xxii
Lampiran 2 Luas Wilayah Kota Semarang ............................................................ xxiii
Lampiran 3 Jumlah Penduduk Kota Semarang ...................................................... xxiv
Lampiran 4 Hasil Kuesioner 1 ................................................................................. xxv
Lampiran 5 Hasil Kuesioner 2 ................................................................................ xxvi
Lampiran 6 Hasil Kuesioner 3 ............................................................................... xxvii
Lampiran 7 Hasil Kuesioner 4 .............................................................................. xxviii
Lampiran 8 Hasil Kuesioner 5 ................................................................................ xxix
xvii
Arti Singkatan
ASCII American Standard Code for Information Interchange
CD-ROM Compact Disk-Read Only Memory
CODO Company Owned Dealer Operated
GIS Geographic Information System
GML Generalized Markup Language
GUI Graphical User Interface
HTML Hypertext Markup Language
ID Identity
ISO International Organization for Standardization
PC Personal Computer
PHP Hypertext Prepocessor
RAM Random Access Memory
SGML Standard Generalized Markup Language
SIG Sistem Informasi Geografis
SPBU Stasiun Pengisian Bahan Bakar untuk Umum
SRS Software Requirement System
UML Unified Modelling Language
VGA Video Graphics Array
W3C World Wide Web Consortium
WHATWG Web Hypertext Application Technology Working Group
xviii
Abstrak
Kecenderungan masyarakat Kota Semarang dalam hal mengetahui informasi
lokasi SPBU, keterbatasan informasi yang diperoleh pada aplikasi website Pertamina
dimana perlu melakukan registrasi online maupun login yang kurang efisien, dan
tidak lengkapnya informasi pada aplikasi pencarian Google Maps. Hal ini
menimbulkan permasalahan untuk memperoleh suatu informasi lengkap dan efisien.
Oleh karena itu, diperlukan untuk membangun aplikasi sistem informasi pemetaan
lokasi SPBU yang berbasis web. Aplikasi yang dirancang menggunakan Google
Maps API sebagai sarana penyediaan peta untuk menampilkan lokasi SPBU di kota
Semarang. Perancangan web dibangun menggunakan aplikasi Macromedia
Dreamweaver, dan PHPMySQL sebagai penyimpanan data lokasi SPBU. Keunggulan
aplikasi ini adalah menyediakan informasi lengkap antara lain: lokasi SPBU, info
SPBU, dan berita terbaru mengenai Pertamina. Pengguna dapat mencari lokasi SPBU
dengan lebih mudah dan tidak perlu untuk registrasi atau login pada website.
Penelitian ini menghasilkan aplikasi sistem informasi pemetaan lokasi SPBU berbasis
web yang dapat memberikan kemudahan kepada pengguna untuk mengetahui
informasi lokasi SPBU di Kota Semarang.
Kata Kunci: Teknologi, Sistem Informasi, Google Maps API.
xix
Abstract
The tendency of people in Semarang in terms know the information location of
gas station, limitedness of information obtained in website application of Pertamina
wherein the need to online registration as well as login that are less efficient, and the
incomplete of information in search application on Google Maps. This poses
problems to obtaining some information are complete an efficient. Therefore, this
problems is necessary to build application of mapping information system of gas
station location are based on web. Designed application used Google Maps API as
means provision of maps to display location of gas stations in Semarang City.
Designed web builded using Macromedia Dreamweaver application, and PHP
MySQL as data storage are location of gas stations. Advantages of application to
provides of comprehensive information such as: location of gas stations, gas station
info, and latest news about Pertamina. User is easily to seacrh location of gas
stations and doesn’t necessary to registration or login on the website. The research is
resulting application of mapping information system of gas station based on web are
can to provide convenience to user to know information location of gas stations in
Semarang city.
Keywords: Technology, Information System, Google Maps.