SISTEM INFORMASI

GEOGRAFIS

TUGAS 2

NAMA : A. A. PRIMANINGRAT GITA P.

NIM : 1104505066

JURUSAN TEKNOLOGI INFORMASI

FAKULTAS TEKNIK

UNIVERSITAS UDAYANA

2014

Tugas kedua ini merupakan pembuatan web service mengenai data perumahan

yang berisi nama pemilik, alamat, dan koordinat 11 rumah yang bertdekatan di suatu

lokasi dengan menggunakan jquery dan database mysql.

Lokasi yang dipakai yaitu di daerah BTN Bumi Dalung Permai blok h3. Mencari

titik koordinatnya menggunakan google maps. Patokan tempat di sekitar rumah di cari

melalui google maps karena daerah perumahan yang di maksud tidak memiliki nama

jalan. Pilih setting pada google maps untuk mencari my place. Gunakan tempat tertentu

pada peta sebagai acuan untuk mencari lokasi yang dimaksud, di sini dipakai bintang

mart, kuta utara, badung, bali.

Gambar 1 (kiri) penentuan titik penting di sekitar lokasi (kanan) lokasi yang dimaksud

Ubah tampilan peta google ke dalam bentuk google earth dengan klik gambar

kotak hijau pada kanan atas untuk lebih mudah melihat area rumah, di dapatlah lokasi

yang di cari. Perbesar daerah yang dimaksud hingga maksimal, klik kanan pada titik

rumah yang ingin diketahui koordinatnya, pilih ada apa di sini.

Gambar 2 (kiri) lokasi perumahan padda google earth (kanan) klik kanan pada rumah pertama untuk mendapat koordinat

Koordinat dari rumah yang dimaksud akan muncul pada kolom kiri atas google

earth. Lakukan hal yang sama untuk 10 rumah lainnya.

Gambar 3 koordinat rumah pertama

Inputkan data mengenai koordinat 11 rumah yang di dapat di google map ke

dalam database mysql dengan nama db_rumah dan nama tabel tb_map.

Gambar 4 Data koordinat rumah pada daabase

Langkah pertama dalam membuat web service yaitu dengan membuat halaman

koneksi.php dengan menggunakan aplikasi dreamweaver. Kondisi dibuat untuk

menghubungkan halaman tampilan webserver dengan db_rumah, tempat tersimpannya

data koordinat 11 rumah yang diperlukan untuk ditampilkan di web service. Script

koneksi.php dapat dilihat pada kode program 1 dibawah.

<?php $koneksi = mysql_connect("localhost","root","");

mysql_select_db("db_rumah") or die ("database error!!");?>

Kode program 1 Halaman koneksi.php

Dibuat halaman index.php untuk menampilkan tabel yang datanya akan

dipanggil dari proses.php. Jangan lupa library jquery akan diperlukan maka copy file

jquery ke dalam folder penyimpanan index.php, proses.php, dan koneksi.php. yang

Penjelasan mengenai script sintaka pada kode program proses.php sebagai berikut :

1. Mysql_query(), digunakan untuk menjalankan query pada database MySQL.

2. Mysql_conect(), digunakan untuk menghubungkan file php dengan database

MySQL.

3. Mysql_fetch_object() digunakan untuk mendapat data dan menjadikan objek

sebagai objek.

4. Array_push digunakan untuk menambah satu atau lebih elemen baru di akhir

array

5. Json_encode pada script proses.php berfungsi untuk transfer data.

<?phpinclude 'koneksi.php';

$sql="Select * from tb_map";$res = mysql_query($sql) or die ("Query error;".mysql_error()); $result = array(); while($row=mysql_fetch_object($res)){ array_push($result, $row);}echo json_encode($result);?>

Kode program 2 Halaman proses.php

Script untuk proses.php dapat juga ditulis seperti pada kode program 3.

Mysql_fetch_assoc digunakan untuk mendapatkan hasil baris/record yang digambarkan

dalam bentuk array (assosiatif). Selain itu, secara internal, penunjuk baris akan bergerak

maju sesuai dengan jumlah record yang ada.

<?phpinclude 'koneksi.php';

$res = mysql_query("Select * from tb_map") or die ("Query error;".mysql_error());$result = array();while($row = mysql_fetch_assoc($res)){

$result[]=$row;}echo json_encode($result);?>

. Kode program 3 Alternatif script halaman proses.php

Halaman index.php dapat dilihat script-nya pada kode program 4. Sertakan

koneksi.php untuk koneksi ke database. Buat tabel dengan atribut sama dengan

database yang akan digunakan yaitu db_rumah dengan atribut id, nama_pemilik,

latitude, dan longitude. Buat tombol dengan fungsi ambil data dari proses.php jika di

klik. Gunakan json untuk transfer data tersebut.

<?phpinclude('koneksi.php');?>

<html><head>

<title>MAPS</title><script src="jquery.js"></script>

</head><br><body align=center> DATA PERUMAHAN </body><br><br>

<table id="tabel" border="1" align="center"><tr><td> ID </td><td> Nama Pemilik </td><td> Alamat

</td><td> Latitude </td><td> Longitude </td></td></table>

<br><input id="tambah_tabel" type="submit" value="ambil data"><script>

$('#tambah_tabel').click(function(){$.get('proses.php',function(output){

for(i=0;i<output.length;i++){

$('<tr><td>'+output[i].id+'</td><td>'+output[i].nama_pemilik+'</td><td>'+output[i].alamat+'</td><td>'+output[i].latitude+'</td><td>'+output[i].longitude+'</td></tr>').appendTo('#tabel');

} },'json');

});</script>

</html>Kode program 4 Halaman index.php

Tampilan web service MAPS dapat dilihat pada gambar 1.

Gambar 5 Tampilan index.php pada browser

Tampilan setelah di klik button ambil data maka akan ditampilkan data yang

terdapat di tabel tb_map pada database db_rumah.

Gambar 6 Tampilan data pada web server