Aplikasi Web Gis Pemetaan Penyebaran Sekolah Di Kota Medan Menggunakan Google Maps Api
ix
APLIKASI WEB GIS PEMETAAN PENYEBARAN SEKOLAH DI
KOTA MEDAN MENGGUNAKAN GOOGLE MAPS API
TUGAS AKHIR
MUHAMMAD TAUFIQ
102406189
PROGRAM STUDI D-3 TEKNIK INFORMATIKA
DEPARTEMEN MATEMATIKA
FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM
UNIVERSITAS SUMATERA UTARA
MEDAN
2013
Universitas Sumatera Utara
ii
PERSETUJUAN
Judul
: APLIKASI WEB GIS PEMETAAN PENYEBARAN
SEKOLAH DI KOTA MEDAN MENGGUNAKAN
GOOGLE MAPS API
Kategori
: TUGAS AKHIR
Nama
: MUHAMMAD TAUFIQ
Nomor Induk Mahasiswa
: 102406189
Program Studi
: DIPLOMA (D3) TEKNIK INFORMATIKA
Departemen
: MATEMATIKA
Fakultas
: MATEMATIKA DAN ILMU PENGETAHUAN
ALAM (FMIPA) UNIVERSITAS SUMATERA
UTARA
Diluluskan di
Medan, Juni 2013
Komisi Pembimbing
:
Diketahui/Disetujui oleh
Departemen Matematika FMIPA USU
Ketua,
Pembimbing,
Prof. Drs. Tulus, M.Si
Nip. 19620901 198803 1 002
Drs. Sawaluddin, MIT
Nip. 19591231 199802 1 001
Universitas Sumatera Utara
iii
PERNYATAAN
APLIKASI WEB GIS PEMETAAN PENYEBARAN SEKOLAH DI KOTA
MEDAN MENGGUNAKAN GOOGLE MAPS API
TUGAS AKHIR
Saya mengakui bahwa tugas akhir ini adalah hasil kerja saya sendiri, kecuali beberapa
kutipan dan ringkasan yang masing-masing disebutkan sumbernya.
Medan,
Juni 2013
MUHAMMAD TAUFIQ
102406189
Universitas Sumatera Utara
iv
PENGHARGAAN
Puji syukur penulis panjatkan kehadirat Tuhan Yang Maha Esa atas limpahan rahmat
dan hidayah-Nya sehingga kajian tugas akhir ini dapat diselesaikan dengan baik dan
dalam waktu yang telah ditetapkan.
Penyusunan tugas akhir ini masih banyak memiliki kekurangan karena
keterbatasan kemampuan dan pengetahuan penulis, sehingga diharapkan kritik dan
saran yang membangun serta dapat memberikan inspirasi yang baik untuk kemajuan
tugas akhir ini.
Tugas Akhir merupakan salah satu syarat yang harus dilakukan setiap
mahasiswa Teknik Informatika untuk dapat menyelesaikan pendidikan di Program
D-3 Teknik Informatika Fakultas Matematika dan Ilmu Pengetahuan Alam di
Universitas Sumatera Utara.
Pada kesempatan ini penulis juga menyampaikan terima kasih kepada seluruh
pihak yang sudah banyak membantu:
1. Bapak Drs. Sawaluddin, M.IT, selaku Dosen pembimbing pada penyelesaian
tugas akhir ini yang telah memberikan panduan dan penuh kepercayaan kepada
penulis untuk menyelesaikan kajian tugas akhir ini.
2. Bapak Syahriol Sitorus S.Si, MIT selaku ketua program studi D3 Teknik
Informatika di Universitas Sumatera Utara.
3. Prof. Drs. Tulus, M.Si, selaku ketua Departemen Matematika di Universitas
Sumatera Utara.
4. Bapak Dr. Sutarman, M.Sc, selaku Dekan Fakultas Matematika dan Ilmu
Pengetahuan Alam di Universitas Sumatera Utara.
5. Para Staf/Pengajar Jurusan D-3 Teknik Informatika FMIPA USU.
6. Kepada ayahanda Suyatno dan bunda Suryani serta keluarga untuk segenap
doa dan dukungannya
7. Seluruh rekan-rekan dari D-3 Teknik Informatika FMIPA USU, khususnya
Kom C 2010, terimakasih atas saran dan kritik dalam penyusunan Tugas Akhir
ini.
Universitas Sumatera Utara
v
ABSTRAK
Pada penulisan tugas akhir ini, penulis membuat aplikasi web gis pemetaan
penyebaran sekolah di kota Medan menggunakan Google Maps Api. Medan
merupakan kota yang sedang berkembang pesat dalam segala aspek pembangunan dan
pendidikan. Aplikasi pemetaan ini merupakan sebuah perangkat lunak yang digunakan
untuk melihat posisi geografis untuk sekolah-sekolah yang ada di kota Medan. Dalam
kaitannya sistem informasi geografis sangat dibutuhkan dalam memastikan suatu data
lokasi. Hal tersebut membuat penulis tertarik membuat aplikasi web gis pemetaan
yang berbentuk elektonik yang praktis dan efisien dalam pencarian lokasi,
ditambahkan fasilitas untuk menambah, menghapus, atau mengganti koordinat suatu
lokasi. Perancangan peta yang ditampilkan dalam sistem ini menggunakan Google
Maps API, perangkat lunak yang digunakan dalam membangun aplikasi ini adalah
PHP (Pear Hypertext Prepocessor) sebagai bahasa pemograman, MySQL sebagai
database server, Adobe Dreamweaver CS5 sebagai penunjang. Metode penelitian yang
digunakan penulis adalah studi pustaka yaitu mengambil bahan dari buku-buku dan
internet. Dalam menjalankan aplikasi ini dibutuhkan koneksi internet untuk meload
peta.
Universitas Sumatera Utara
vi
DAFTAR ISI
Persetujuan
Pernyataan
Penghargaan
Abstrak
Daftar Isi
Daftar Tabel
Daftar Gambar
Halaman
ii
iii
iv
v
vi
viii
ix
BAB 1 PENDAHULUAN
1.1 Latar Belakang Masalah
1.2 Rumusan Masalah
1.3 Batasan Masalah
1.4 Tujuan
1.5 Manfaat
1.6 Sistematika Penulisan
1
1
2
2
3
3
4
BAB 2 LANDASAN TEORI
2.1 Geographic Information System
2.1.1 Komponen GIS
2.2 Google Maps
2.2.1 Cara Kerja Google Map
2.2.2 Migrasi Google Map API v2 ke v3
2.3 PHP
2.3.1 Kelebihan PHP
2.4 MySQL
2.5 Java Script dan Koneksi Google Maps API
2.6 Adobe Dreameaver CS5.5
2.7 JQuery
2.8 Adobe Photoshop CS5
2.9 Flow-Chart
5
5
5
6
7
7
8
9
9
11
11
12
13
14
BAB 3 PERANCANGAN SISTEM
3.1 Gambaran Umum Sistem Perancangan
3.2 Flowchart Sistem
3.3 Perancangan Database
3.4 Membangun Halaman Situs
3.4.1 Halaman Pengguna Biasa
3.4.2 Halaman Pengguna Admin
3.4 Algoritma
17
17
18
20
23
23
23
25
Universitas Sumatera Utara
vii
BAB 4 IMPLEMENTASI
4.1 Pengertian Implementasi
4.2 Komponen Sistem
4.2.1 Hardware
4.2.2 Software
4.2.3 Jaringan Internet
4.3 Instalasi Paket Server
4.4 Pengujian Website di Browser
4.5 Prosedur Persiapan Program
4.6 Demonstrasi Program
27
27
27
27
28
28
28
31
32
35
BAB 5 KESIMPULAN DAN SARAN
5.1 Kesimpulan
5.2 Saran
37
38
38
39
Daftar Pustaka
Lampiran:
Listing Program
40
Universitas Sumatera Utara
viii
DAFTAR TABEL
Tabel 3.1
Tabel 3.1
Tabel 3.2
Tabel 3.3
Tabel 3.4
Flow-Chart
Tabel Sekolah
Tabel Users
Tabel Saran
Tabel Berita
Halaman
10
10
12
21
28
Universitas Sumatera Utara
ix
DAFTAR GAMBAR
Gambar 2.1 Komponen GIS
Gambar 2.2 Google Map v2 dan v3
Gambar 2.3 Tampilan Adobe Dreameaver CS5.5
Gambar 3.1 Flowchart Halaman Utama
Gambar 3.2 Flowchart Register
Gambar 3.3 Flowchart Halaman Admin
Gambar 2.4 Tampilan Adobe Photoshop CS5
Gambar 4.1 Folder Installer Xampp
Gambar 4.2 Pemilihan Bahasa
Gambar 4.3 Pemilihan Lokasi Berkas
Gambar 4.4 Pemilihan paket-paket Instalasi
Gambar 4.5 Dialog Xampp berhasil diinstal
Gambar 4.6 Letak Folder Xampp
Gambar 4.7 Panel kontrol xampp
Gambar 4.8 Tampilan Halaman Depan
Gambar 4.9 Phpmyadmin Membuat database baru
Gambar 4.10 Phpmyadmin Import Tabel
Gambar 4.11 Tampilan Halaman Depan
Gambar 4.12 Tampilan Halaman Login
Gambar 4.13 Tampilan Halaman Lihat Peta
Gambar 4.14 Tampilan HalamanTentang Program
Gambar 4.15 Tampilan Halaman Cari lokasi
Gambar 4.16 Tampilan Halaman Tambah Lokasi
Halaman
5
8
12
18
19
20
14
28
29
29
30
30
31
31
32
33
34
35
35
36
36
37
37
Universitas Sumatera Utara
APLIKASI WEB GIS PEMETAAN PENYEBARAN SEKOLAH DI
KOTA MEDAN MENGGUNAKAN GOOGLE MAPS API
TUGAS AKHIR
MUHAMMAD TAUFIQ
102406189
PROGRAM STUDI D-3 TEKNIK INFORMATIKA
DEPARTEMEN MATEMATIKA
FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM
UNIVERSITAS SUMATERA UTARA
MEDAN
2013
Universitas Sumatera Utara
ii
PERSETUJUAN
Judul
: APLIKASI WEB GIS PEMETAAN PENYEBARAN
SEKOLAH DI KOTA MEDAN MENGGUNAKAN
GOOGLE MAPS API
Kategori
: TUGAS AKHIR
Nama
: MUHAMMAD TAUFIQ
Nomor Induk Mahasiswa
: 102406189
Program Studi
: DIPLOMA (D3) TEKNIK INFORMATIKA
Departemen
: MATEMATIKA
Fakultas
: MATEMATIKA DAN ILMU PENGETAHUAN
ALAM (FMIPA) UNIVERSITAS SUMATERA
UTARA
Diluluskan di
Medan, Juni 2013
Komisi Pembimbing
:
Diketahui/Disetujui oleh
Departemen Matematika FMIPA USU
Ketua,
Pembimbing,
Prof. Drs. Tulus, M.Si
Nip. 19620901 198803 1 002
Drs. Sawaluddin, MIT
Nip. 19591231 199802 1 001
Universitas Sumatera Utara
iii
PERNYATAAN
APLIKASI WEB GIS PEMETAAN PENYEBARAN SEKOLAH DI KOTA
MEDAN MENGGUNAKAN GOOGLE MAPS API
TUGAS AKHIR
Saya mengakui bahwa tugas akhir ini adalah hasil kerja saya sendiri, kecuali beberapa
kutipan dan ringkasan yang masing-masing disebutkan sumbernya.
Medan,
Juni 2013
MUHAMMAD TAUFIQ
102406189
Universitas Sumatera Utara
iv
PENGHARGAAN
Puji syukur penulis panjatkan kehadirat Tuhan Yang Maha Esa atas limpahan rahmat
dan hidayah-Nya sehingga kajian tugas akhir ini dapat diselesaikan dengan baik dan
dalam waktu yang telah ditetapkan.
Penyusunan tugas akhir ini masih banyak memiliki kekurangan karena
keterbatasan kemampuan dan pengetahuan penulis, sehingga diharapkan kritik dan
saran yang membangun serta dapat memberikan inspirasi yang baik untuk kemajuan
tugas akhir ini.
Tugas Akhir merupakan salah satu syarat yang harus dilakukan setiap
mahasiswa Teknik Informatika untuk dapat menyelesaikan pendidikan di Program
D-3 Teknik Informatika Fakultas Matematika dan Ilmu Pengetahuan Alam di
Universitas Sumatera Utara.
Pada kesempatan ini penulis juga menyampaikan terima kasih kepada seluruh
pihak yang sudah banyak membantu:
1. Bapak Drs. Sawaluddin, M.IT, selaku Dosen pembimbing pada penyelesaian
tugas akhir ini yang telah memberikan panduan dan penuh kepercayaan kepada
penulis untuk menyelesaikan kajian tugas akhir ini.
2. Bapak Syahriol Sitorus S.Si, MIT selaku ketua program studi D3 Teknik
Informatika di Universitas Sumatera Utara.
3. Prof. Drs. Tulus, M.Si, selaku ketua Departemen Matematika di Universitas
Sumatera Utara.
4. Bapak Dr. Sutarman, M.Sc, selaku Dekan Fakultas Matematika dan Ilmu
Pengetahuan Alam di Universitas Sumatera Utara.
5. Para Staf/Pengajar Jurusan D-3 Teknik Informatika FMIPA USU.
6. Kepada ayahanda Suyatno dan bunda Suryani serta keluarga untuk segenap
doa dan dukungannya
7. Seluruh rekan-rekan dari D-3 Teknik Informatika FMIPA USU, khususnya
Kom C 2010, terimakasih atas saran dan kritik dalam penyusunan Tugas Akhir
ini.
Universitas Sumatera Utara
v
ABSTRAK
Pada penulisan tugas akhir ini, penulis membuat aplikasi web gis pemetaan
penyebaran sekolah di kota Medan menggunakan Google Maps Api. Medan
merupakan kota yang sedang berkembang pesat dalam segala aspek pembangunan dan
pendidikan. Aplikasi pemetaan ini merupakan sebuah perangkat lunak yang digunakan
untuk melihat posisi geografis untuk sekolah-sekolah yang ada di kota Medan. Dalam
kaitannya sistem informasi geografis sangat dibutuhkan dalam memastikan suatu data
lokasi. Hal tersebut membuat penulis tertarik membuat aplikasi web gis pemetaan
yang berbentuk elektonik yang praktis dan efisien dalam pencarian lokasi,
ditambahkan fasilitas untuk menambah, menghapus, atau mengganti koordinat suatu
lokasi. Perancangan peta yang ditampilkan dalam sistem ini menggunakan Google
Maps API, perangkat lunak yang digunakan dalam membangun aplikasi ini adalah
PHP (Pear Hypertext Prepocessor) sebagai bahasa pemograman, MySQL sebagai
database server, Adobe Dreamweaver CS5 sebagai penunjang. Metode penelitian yang
digunakan penulis adalah studi pustaka yaitu mengambil bahan dari buku-buku dan
internet. Dalam menjalankan aplikasi ini dibutuhkan koneksi internet untuk meload
peta.
Universitas Sumatera Utara
vi
DAFTAR ISI
Persetujuan
Pernyataan
Penghargaan
Abstrak
Daftar Isi
Daftar Tabel
Daftar Gambar
Halaman
ii
iii
iv
v
vi
viii
ix
BAB 1 PENDAHULUAN
1.1 Latar Belakang Masalah
1.2 Rumusan Masalah
1.3 Batasan Masalah
1.4 Tujuan
1.5 Manfaat
1.6 Sistematika Penulisan
1
1
2
2
3
3
4
BAB 2 LANDASAN TEORI
2.1 Geographic Information System
2.1.1 Komponen GIS
2.2 Google Maps
2.2.1 Cara Kerja Google Map
2.2.2 Migrasi Google Map API v2 ke v3
2.3 PHP
2.3.1 Kelebihan PHP
2.4 MySQL
2.5 Java Script dan Koneksi Google Maps API
2.6 Adobe Dreameaver CS5.5
2.7 JQuery
2.8 Adobe Photoshop CS5
2.9 Flow-Chart
5
5
5
6
7
7
8
9
9
11
11
12
13
14
BAB 3 PERANCANGAN SISTEM
3.1 Gambaran Umum Sistem Perancangan
3.2 Flowchart Sistem
3.3 Perancangan Database
3.4 Membangun Halaman Situs
3.4.1 Halaman Pengguna Biasa
3.4.2 Halaman Pengguna Admin
3.4 Algoritma
17
17
18
20
23
23
23
25
Universitas Sumatera Utara
vii
BAB 4 IMPLEMENTASI
4.1 Pengertian Implementasi
4.2 Komponen Sistem
4.2.1 Hardware
4.2.2 Software
4.2.3 Jaringan Internet
4.3 Instalasi Paket Server
4.4 Pengujian Website di Browser
4.5 Prosedur Persiapan Program
4.6 Demonstrasi Program
27
27
27
27
28
28
28
31
32
35
BAB 5 KESIMPULAN DAN SARAN
5.1 Kesimpulan
5.2 Saran
37
38
38
39
Daftar Pustaka
Lampiran:
Listing Program
40
Universitas Sumatera Utara
viii
DAFTAR TABEL
Tabel 3.1
Tabel 3.1
Tabel 3.2
Tabel 3.3
Tabel 3.4
Flow-Chart
Tabel Sekolah
Tabel Users
Tabel Saran
Tabel Berita
Halaman
10
10
12
21
28
Universitas Sumatera Utara
ix
DAFTAR GAMBAR
Gambar 2.1 Komponen GIS
Gambar 2.2 Google Map v2 dan v3
Gambar 2.3 Tampilan Adobe Dreameaver CS5.5
Gambar 3.1 Flowchart Halaman Utama
Gambar 3.2 Flowchart Register
Gambar 3.3 Flowchart Halaman Admin
Gambar 2.4 Tampilan Adobe Photoshop CS5
Gambar 4.1 Folder Installer Xampp
Gambar 4.2 Pemilihan Bahasa
Gambar 4.3 Pemilihan Lokasi Berkas
Gambar 4.4 Pemilihan paket-paket Instalasi
Gambar 4.5 Dialog Xampp berhasil diinstal
Gambar 4.6 Letak Folder Xampp
Gambar 4.7 Panel kontrol xampp
Gambar 4.8 Tampilan Halaman Depan
Gambar 4.9 Phpmyadmin Membuat database baru
Gambar 4.10 Phpmyadmin Import Tabel
Gambar 4.11 Tampilan Halaman Depan
Gambar 4.12 Tampilan Halaman Login
Gambar 4.13 Tampilan Halaman Lihat Peta
Gambar 4.14 Tampilan HalamanTentang Program
Gambar 4.15 Tampilan Halaman Cari lokasi
Gambar 4.16 Tampilan Halaman Tambah Lokasi
Halaman
5
8
12
18
19
20
14
28
29
29
30
30
31
31
32
33
34
35
35
36
36
37
37
Universitas Sumatera Utara