The Integration of Spatial Data WMS and KML Format with Google Maps in Bakosurtanal WebGIS.

(1)

ABSTRACT

DONY ARIYANTO. The Integration of Spatial Data WMS and KML Format with Google Maps in BAKOSURTANAL WebGIS. Under direction of HARI AGUNG ADRIANTO and GATOT PRAMONO.

The development of Geographical Information System (GIS) technology nowadays has increased the needs of data services. The spatial data can be distributed to each institution through a standard provision of access to spatial data such as Web Map Service (WMS) and Keyhole Markup Language (KML). Google Maps, a service provider of maps and satellite images, provides an easy way for WebGIS developers to create their own composition maps. Google Maps can be integrated with spatial data, the WMS and KML format. BAKOSURTANAL have built a data-based mapping system that connects the data with the provincial BAPPEDA. This system is called Geografis Marine Resource Information System – Marine and Coastal Resource Management Project (GMRIS-MCRMP). This Open Source-based systems includes application to upload, edit and display data that is part of the spatial data catalog of BAKOSURTANAL which is located at the Central Survey of Natural Sea (PSSDAL) and this system can be accessed on

http://pssdal.bakosurtanal.go.id. BAKOSURTANAL specifically has provided spatial data through WMS. The aim of this research is to create a mapping system that can integrate spatial data format WMS and KML with Google Maps, and see the difference in time required to display maps between google maps and an old system, which displays the map using the framework chameoleon. The results of this research show that the mapping system which is integrated with Google Maps is able to display the spatial data layer format WMS and KML. With google maps, mapping systems are relatively faster in displaying a map composition.

(2)

INTEGRASI DATA SPASIAL FORMAT WMS DAN KML DENGAN

GOOGLE MAPS

DALAM WEBGIS DI BAKOSURTANAL

DONY ARIYANTO

DEPARTEMEN ILMU KOMPUTER

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM

INSTITUT PERTANIAN BOGOR

(3)

GOOGLE MAPS

DONY ARIYANTO

DEPARTEMEN ILMU KOMPUTER

(4)

GOOGLE MAPS

Skripsi

Sebagai salah satu syarat untuk memperoleh gelar Sarjana Komputer

pada Fakultas Matematika dan Ilmu Pengetahuan Alam

Institut Pertanian Bogor

DONY ARIYANTO

G64050639

DEPARTEMEN ILMU KOMPUTER

(5)

ABSTRACT

DONY ARIYANTO. The Integration of Spatial Data WMS and KML Format with Google Maps in BAKOSURTANAL WebGIS. Under direction of HARI AGUNG ADRIANTO and GATOT PRAMONO.

The development of Geographical Information System (GIS) technology nowadays has increased the needs of data services. The spatial data can be distributed to each institution through a standard provision of access to spatial data such as Web Map Service (WMS) and Keyhole Markup Language (KML). Google Maps, a service provider of maps and satellite images, provides an easy way for WebGIS developers to create their own composition maps. Google Maps can be integrated with spatial data, the WMS and KML format. BAKOSURTANAL have built a data-based mapping system that connects the data with the provincial BAPPEDA. This system is called Geografis Marine Resource Information System – Marine and Coastal Resource Management Project (GMRIS-MCRMP). This Open Source-based systems includes application to upload, edit and display data that is part of the spatial data catalog of BAKOSURTANAL which is located at the Central Survey of Natural Sea (PSSDAL) and this system can be accessed on

http://pssdal.bakosurtanal.go.id. BAKOSURTANAL specifically has provided spatial data through WMS. The aim of this research is to create a mapping system that can integrate spatial data format WMS and KML with Google Maps, and see the difference in time required to display maps between google maps and an old system, which displays the map using the framework chameoleon. The results of this research show that the mapping system which is integrated with Google Maps is able to display the spatial data layer format WMS and KML. With google maps, mapping systems are relatively faster in displaying a map composition.

(6)

Judul : Integrasi Data Spasial Format WMS dan KML dengan Google Maps

dalam WebGIS BAKOSURTANAL

Nama : Dony Ariyanto

NIM : G64050639

Menyetujui:

Pembimbing I,

Pembimbing II,

Hari Agung Adrianto, S.Kom, M.Si

Dr. Gatot Pramono

NIP 197609172005011001

NIP 197101061989121002

Mengetahui:

Dekan Fakultas Matematika dan Ilmu Pengetahuan Alam

Institut Pertanian Bogor

Dr. drh. Hasim, DEA

NIP 196193281986011002

(7)

RIWAYAT HIDUP

Penulis dilahirkan di Jakarta, pada tanggal 9 Januari 1987. Penulis merupakan anak bungsu dari tiga bersaudara dari pasangan Ayah Mulyono Sutarno dan Ibu Titi Marnisari. Pada tahun 2005 penulis menyelesaikan pendidikan tingkat atas di SMAN 90 Jakarta. Di tahun yang sama, penulis diterima di Institut Pertanian Bogor melalui jalur Seleksi Penerimaan Mahasiswa Baru (SPMB) dan menjadi mahasiswa TPB (Tingkat Persiapan Bersama). Pada tahun 2006, penulis diterima sebagai mahasiswa Ilmu Komputer di Departemen Ilmu Komputer IPB setelah setahun menjalani masa TPB.

Pada Juli sampai dengan Agustus tahun 2008

,

penulis melaksanakan kegiatan praktik kerja lapangan di PT. Apexindo Pratama Duta, Tbk dengan mengerjakan pembuatan sistem pencatatan

(8)

PRAKATA

Alhamdulillaahirabbil 'aalamiin, puji dan syukur penulis ucapkan kehadirat Allah

Subhanahu Wa Ta‘Ala yang telah melimpahkan rahmat dan hidayah-Nya sehingga tugas akhir penulis dapat terselesaikan tanpa kendala. Penulis melakukan kegiatan magang untuk menyelesaikan tugas akhir di BAKOSURTANAL dengan bidang kajian Integrasi Web Map Service dan Keyhole Markup Language dengan Google Maps pada WebGIS di BAKOSURTANAL. Maksud dan tujuan penyusunan tugas akhir ini adalah sebagai syarat untuk memperoleh gelar Sarjana Komputer di Departemen Ilmu Komputer FMIPA IPB.

Penelitian dan penulisan tugas akhir ini berlangsung di bawah bimbingan Bapak Dr. Gatot Pramono selaku pembimbing penulis di BAKOSURTANAL, yaitu tempat pengerjaan penelitian penulis dan Bapak Hari Agung Adrianto, S.Kom, M.Si. sebagai dosen pembimbing di Departemen Ilmu Komputer. Penulis menyadari bahwa dalam penyusunan karya ilmiah ini tidak luput dari dukungan berbagai pihak, oleh karena itu dalam kesempatan ini penulis menyampaikan ucapan penghargaan dan terima kasih kepada Bapak Hari Agung Adrianto, S.Kom., M.Si dan Bapak Dr. Gatot. Pramono yang telah bersedia meluangkan waktu serta memberikan saran dan bimbingannya selama penelitian dan penulisan tugas akhir ini berlangsung, kepada Bapak Suseno S.T. dan Ibu Susan S.Kom selaku staf di BAKOSURTANAL yang telah banyak membantu, kepada Bapak Ahmad Ridha S.Kom, MS sebagai dosen penguji, kepada Ibu Rahma, Bapak Soleh dan Bapak Efendi yang telah banyak membantu dalam proses seminar dan persidangan penulis, serta kepada Auriza Akbar yang menjadi rekan satu tim dalam penyelesaian tugas akhir ini. Penghargaan dan ucapan terima kasih juga penulis sampaikan kepada keluarga tercinta, Ayah, Ibu, Mba Pepi, Mas Anto, Mba Hesti serta Asya Adwa Hafizah yang tak kenal lelah memberikan

dukungan moril, do‟a, kasih sayang maupun materiil. Tak lupa penulis ucapkan terima kasih yang sebesar-besarnya kepada Ciramudya Adha Gafawidj yang selalu memberikan dukungan mental dan kasih sayang, kepada rekan-rekan komunitas Graderz atas waktu dan ide, kepada rekan-rekan ilkomerz42 seperjuangan yang turut membantu baik langsung maupun tidak, kepada rekan-rekan komunitas RC, kepada rekan-rekan komunitas pasta yang telah berbagi waktu, ide, do‟a dan rasa kekeluargaan selama ini.

Demikian prakata ini penulis buat, semoga bermanfaat, khususnya bagi penulis dan bagi pembaca pada umumnya, amiin ya rabbal'alamin.

Bogor, Mei 2009

(9)

iv

DAFTAR ISI

Halaman

DAFTAR GAMBAR ... v

DAFTAR LAMPIRAN ... v

PENDAHULUAN Latar Belakang ... 1

Tujuan... 2

Ruang Lingkup ... 2

TINJAUAN PUSTAKA Google Maps ... 2

Web Map Service (WMS) ... 2

Keyhole Markup Language (KML) ... 2

Wikimapia ... 2

AJAX ... 2

JavaScript Object Notation (JSON) ... 3

Integrasi WMS-Google Maps ... 3

METODE PENELITIAN Metode Prototipe ... 3

Pendaftaran Sistem ... 4

HASIL DAN PEMBAHASAN Lingkungan Pengembangan ... 4

Definisi Sistem Pertama ... 4

Validasi Pertama... 5

Google Maps API ... 5

Arsitektur Sistem ... 5

Penggunaan JSON ... 6

Integrasi dengan KML ... 6

Integrasi Inkremen Sistem ... 6

Pengujian Sistem ... 7

Evaluasi Sistem ... 7

KESIMPULAN DAN SARAN Kesimpulan ... 7

Saran ... 8

DAFTAR PUSTAKA ... 8

(10)

v

DAFTAR GAMBAR

Halaman

1 Tampilan peta saat awal pemuatan. ... 1

2 Tampilan saat operasi zoom. ... 1

3 Tampilan saat digeser. ... 1

4 Struktur JSON (http://www.json.org/json-id.html). ... 3

5 Proses pengembangan inkremental (Sommerville 2003). ... 3

6 Key yang didapatkan. ... 4

7 Uji coba OpenLayers. ... 5

8 Arsitektur sistem. ... 5

9 Ilustrasi floating layer. ... 6

10 Penggunaan JSON ... 6

11 Pengujian pemuatan peta. ... 7

12 Pengujian Operasi Zoom. ... 7

13 GetFeatureInfo pada layer WMS. ... 7

14 GetFeatureInfo pada layer roadlessland. ... 7

DAFTAR LAMPIRAN Halaman 1 Arsitektur GMRIS-MCRMP ... 10

2 Tampilan peta saat pemuatan awal ... 11

(11)

1

PENDAHULUAN

Latar Belakang

Seiring berkembangnya era teknologi informasi serta kebutuhan data yang semakin bertambah, Sistem Informasi Geografis (SIG) kini dirancang sedemikian rupa agar bisa diakses oleh seluruh pengguna di mana saja, secara interaktif, dan tanpa harus bertemu secara fisik antara satu pengguna dengan pengguna lainnya (Prahasta 2006). Sehubungan dengan maraknya kebutuhan esensial ini, sudah banyak institusi yang menyediakan data terkait, baik secara komersial maupun non-komersial.

BAKOSURTANAL saat ini telah membangun suatu sistem pemetaan data berbasis internet Geografis Marine Resource information System – Marine and Coastal Resource Management Project (GMRIS-MCRMP). Sistem ini menghubungkan data spasial dengan data Bappeda tingkat provinsi. Sistem GMRIS–MCRMP ini menggunakan MapServer sebagai Map Engine dan

framework Chameleon. Data vektor yang digunakan adalah shapefile, sedangkan data rasternya berformat JPEG. Arsitektur GMRIS-MCRMP dapat dilihat pada Lampiran 1. Sistem yang dibangun BAKOSURTANAL ini mempunyai keterbatasan kecepatan tampilan dan background citra yang tidak seamless

(tidak kontinu). Pada kasus uji yang dilakukan di BAKOSURTANAL ditampilkan peta administrasi kabupaten di provinsi Kalimantan Tengah dengan waktu loading

untuk menampilkan petanya sekitar 1 detik pada saat awal (Gambar 1). Ketika dilakukan operasi zoom, peta tampil dalam waktu sekitar 2 detik (Gambar 2). Pada saat dilakukan operasi pergeseran koordinat, peta tampil dengan waktu loading sekitar 2 detik dan citra tersebut tidak seamless (Gambar 3).

Gambar 1 Tampilan peta saat awal pemuatan.

Gambar 2 Tampilan saat operasi zoom.

Gambar 3 Tampilan saat digeser.

Institusi penyedia data seperti BAKOSURTANAL secara khusus, menyebarkan datanya melalui WMS (Web Map Service). Dengan WMS, setiap pengguna dapat mengakses data spasial yang tersebar di berbagai server yang berbeda, seperti pada BAKOSURTANAL dan kemudian memanfaatkannya untuk membentuk komposisi petanya sendiri.

(12)

2

Tujuan

Tujuan penelitian ini adalah:

1. Menggunakan Google Maps sebagai penyaji peta dasar dan mengintegrasikannya dengan data spasial berformat WMS dan KML.

2. Melihat perbedaan lamanya waktu yang dibutuhkan untuk menampilkan komposisi peta antara sistem pemetaan yang menggunakan Google Maps dengan sistem pemetaan yang lama menggunakan

framework Chameleon.

Ruang Lingkup

Ruang lingkup penelitian ini difokuskan kepada pengintegrasian data spasial format WMS dan format KML dengan Google Maps. Data spasial WMS yang digunakan adalah WMS dari BAKOSURTANAL, sedangkan data spasial berformat KML didapat dari KML yang dipublikasikan di internet. Data WMS maupun KML diambil melalui query

JavaScript, lalu menghasilkan layer-layer, dan selanjutnya ditampilkan di atas peta dasar Google Maps

TINJAUAN PUSTAKA

Google Maps

Google Maps memberikan sebuah jasa peta globe virtual gratis dan online dengan menyediakan peta dan gambar satelit yang dapat diintegrasikan di dalam sistem yang sebelumnya telah terdaftar. Google Maps mengijinkan pengguna untuk mengubah atau menambah fitur yang disediakan sehingga dapat mempermudah pengguna untuk memvisualisasikan data spasial yang ada (Pimpler 2009).

Web Map Service (WMS)

Peta yang bereferensi geografis dihasilkan dari sebuah web map service. Peta ini biasanya disajikan dalam format gambar seperti PNG, GIF, JPEG, SVG atau WebCGM. Pada penelitian ini digunakan format PNG karena format ini transparan terhadap gambar latar belakangnya, dan kompresinya lebih baik daripada GIF. Tiga keunggulan format PNG adalah format ini memiliki alpha channel (variabel transparansi), kontrol kecerahan gambar, dan dua dimensi interlacing (Dubost 2004). WMS memiliki tiga buah operasi WMS pada saat tahap implementasi (OGC-WMS 01-047r2).

GetCapabilities

berisikan deskripsi informasi yang dimiliki WMS dan parameter permintaan yang dapat diterima.

GetMap

mendapatkan peta dengan parameter dimensi dan geospatial yang telah didefinisikan dengan jelas.

GetFeatureInfo

meminta informasi mengenai fitur tertentu yang ditampilkan pada peta.

Keyhole Markup Language (KML)

KML adalah XML yang berfokus pada visualisasi geografis, termasuk anotasi peta dan citra. Visualisasi geografisnya mencakup tidak hanya penyajian data grafik di peta dunia tetapi juga dalam hal navigasi kendali dalam mengarahkan pengguna saat penggunaan peta (OGC-KML 07-147r2).

KML mempunyai suatu set struktur berupa tempat, foto, polygon, model 3D, teks keterangan, dan lain-lain untuk ditampilkan di dalam Google Earth, Google Maps, dan

Mobile. Setiap tempat memiliki bujur dan lintang. Dari data XML inilah dapat dipetakan ke dalam Google Maps menjadi sebuah layer

KML.

Wikimapia

Wikimapia adalah sumber peta online yang mengkombinasikan antara Google Maps dengan sistem Wiki. Wikimapia memungkinkan pengguna untuk menambahkan informasi (dalam bentuk catatan) pada lokasi manapun di bumi. Wikimapia mempunyai data KML yang dapat diintegrasikan ke dalam sistem pemetaan yang memakai Google Maps (http://wikimapiablog.blogspot.com/).

AJAX

(13)

3 interaksi pengguna dengan server (James

2005).

JavaScript Object Notation (JSON)

JSON memiliki struktur dengan data

nesting element, seperti layaknya XML. Penggunaan JSON selain memudahkan pengembang untuk membaca dan menulis, juga dapat memudahkan komputer dalam memparsing sebuah data. Struktur JSON dapat dilihat pada Gambar 4. Penggunaan JSON pada pemetaan ini untuk mewakili data yang tersimpan hasil permintaan pengguna.

Gambar 4 Struktur JSON (Shin 2007).

Integrasi WMS-Google Maps

WMS menyajikan data spasial peta atau citra, yang akan menjadi layer saat visualisasi di browser. Dengan melakukan request

GetMap (salah satu operasi WMS), akan dihasilkan tampilan peta berupa layer yang melapisi (overlay) peta dasar Google Maps. Google Maps memberikan kemudahan untuk menampilkan layer yang diminta pengguna ke dalam peta. Ada dua teknik pengintegrasian

layer WMS ke dalam peta Google Maps (Guda 2008), yaitu:

1. Base Layer. Teknik ini dilakukan dengan menggabungkan layer yang didapat dari

operasi permintaan WMS dengan salah satu tipe peta dasar Google Maps. Layer hasil query tersebut tidak overlay

terhadap tipe peta dasar lainnya, kecuali teknik ini dilakukan terhadap semua jenis peta dasar Google Maps.

2. Floating Layer. Layer hasil query dari operasi WMS dijadikan overlay terhadap semua jenis peta dasar Google Maps. Semua layer dari WMS berada pada layer

penampung di atas peta dasar Google Maps. Jadi ketika diubah jenis peta dasarnya, maka layer tersebut tetap menumpuk terhadap peta dasarnya.

METODE PENELITIAN

Metode Prototipe

Penelitian ini dilakukan dengan menggunakan metode pengembangan prototipe. Pada metode prototipe yang digunakan adalah pengembangan inkremental. Pengembangan inkremental dibagi menjadi beberapa tahap, yaitu (1) Definisi sistem, (2) Desain arsitektur sistem, (3) Pembuatan inkremen sistem, (4) Validasi inkremen, (5) Integrasi inkremen, (6) Validasi sistem, (7) Penyerahan Sistem. Pengembangan incremental menghindari beberapa masalah perubahan konstan. Arsitektur sistem yang menyeluruh ditentukan pada awal proses untuk berfungsi sebagai kerangka kerja. Proses pengembangan inkremental tersebut dapat dilihat pada Gambar 5.

Definisi Sistem Desain Arsitektur Sistem Spesifisik Inkremen Sistem Buat Inkremen Sistem Validasi Inkremen Integrasi Inkremen Validasi Sistem Sistem Lengkap? Serahkan Sistem Akhir TIDAK YA Disetujui? YA TIDAK

(14)

4 Pada tahap spesifikasi inkremen sistem

disetujui, tahapan inkremen selanjutnya dilakukan. Jika tidak memenuhi permintaan pengguna, maka sistem didefinisikan dari awal, hingga mempunyai desain arsitektur dan spesifik yang memenuhi.

Pendaftaran Sistem

Sebelum dapat menampilkan suatu peta pada browser, dilakukan pendaftaran untuk mendapatkan Google API key. Dengan mendaftarkan direktori utama, maka dapat ditampilkan peta di seluruh situs tersebut, baik pada direktori utama maupun pada sub-direktori. Alamat yang didaftarkan yaitu

http://pssdal.bakosurtanal.go.id.

Setelah melakukan pendaftaran didapatkan

key beserta template kode program yang diberikan oleh Google Maps API yang selanjutnya bisa dimodifikasi. Secara default

Google Maps menyediakan key yang dapat digunakan seperti terlihat pada Gambar 6.

Gambar 6 Key yang didapatkan. Beberapa persyaratan penting yang harus dipenuhi ketika mendaftarkan situs ke Google adalah:

1. Tidak ada batasan pada jumlah tampilan halaman yang memakai Maps API. Namun jika menggunakan 500.000 tampilan halaman per hari, diharapkan menghubungi Google Maps Official untuk mendapatkan tambahan kapasitas.

2. Mempunyai batasan pada jumlah permintaan Geocode per hari.

3. Maps API tidak termasuk iklan. 4. Harus dapat diakses secara bebas.

5. Tidak boleh mengganti logo atau atribut peta Google.

Template yang disediakan oleh Google Maps tersebut dapat diubah sesuai dengan keinginan. Key yang didapat adalah

“ABQIAAAAbUZP9JF5NRWZ52aveQc1XRSa on_P9ZMIQjrevEvGh19yVJuHxBStnNjQmOP

ML2Xt3QKw1QsUdDq78g”. Penampilan peta dimulai dengan syarat browser yang digunakan oleh pengguna kompatibel. Google Maps akan menampilkan peta dengan titik tengah peta menunjuk ke koordinat posisi

longitude dan latitude serta memiliki zoom

level berkisar dari 1 sampai 16. Terdapat tiga buah tampilan peta yang dapat dipilih yaitu

map, satellite dan hybrid.

Operasi WMS yang diterapkan pada penelitian ini adalah GetCapabilities, yang berisikan deskripsi informasi yang dimiliki WMS dan parameter yang dapat diterima dan operasi GetMap untuk mendapatkan peta yang didefinisikan dengan jelas. Satu operasi tambahan yang diperlukan adalah GetFeatureInfo yang meminta informasi mengenai fitur tertentu yang ditampilkan pada peta saat dilakukan klik area peta. Setelah integrasi dengan WMS berhasil, dilakukan integrasi dengan KML.

HASIL DAN PEMBAHASAN

Lingkungan Pengembangan

Lingkungan pengembangan sistem ini pada sisi perangkat keras menggunakan: 1. Pentium Core 2 Duo 2.0

2. RAM 2 GB

Pada sisi perangkat lunaknya pengembangan sistem ini menggunakan: 1. Editor Notepad ++

2. Browser Mozilla Firefox versi 3.0.11 3. Sistem Operasi Windows XP SP2

Pada sisi lainnya spesifikasi WMS dan KML yang dapat diintegrasikan adalah: 1. WMS versi 1.1.1

2. KML versi 2.0

Definisi Sistem Pertama

Pada awalnya, pengembangan sistem ini menggunakan bantuan framework

OpenLayers. Pemakaian OpenLayers menyebabkan pemunculan peta Google Maps dan WMS dikendalikan oleh OpenLayers. Definisi pertama ini ditolak oleh pengguna karena saat dilakukan uji lamanya waktu menampilkan, sistem yang menggunakan OpenLayers ini membutuhkan waktu rata-rata sekitar 5.24 detik. Hal ini disebabkan karena

(15)

5 kode script, yaitu ke WMS

BAKOSURTANAL dan ke server Google.

Gambar 7 Uji coba OpenLayers. Pada Gambar 7 dapat dilihat bahwa untuk menampilkan komposisi petanya, OpenLayers membutuhkan waktu yang lebih lama dibandingkan dengan tanpa pemakaian OpenLayers. Oleh karena itu, pengembangan selanjutnya memakai JavaScript Google Maps API.

Validasi Pertama

Pengajuan sistem menggunakan OpenLayers ini ditolak oleh pengguna. Pengguna tersebut adalah Dr. Gatot Pramono, yang merupakan pengembang sistem GMRIS-MCRMP. Dengan tidak validnya sistem ini sesuai dengan keinginan pengguna, maka spesifikasi tersebut diulang dari tahap awal, dengan tidak menggunakan OpenLayers.

Google Maps API

Pendefinisan sistem yang ke dua meninggalkan pemakaian OpenLayers dan menggunakan secara penuh pemrogaman

Google Maps API. Dengan pemakaian kode-kode yang diberikan Google Maps API ini, peta Google Map dapat diintegrasikan dengan format WMS maupun KML. Pada tahap ini, integrasi WMS dengan Google Maps menggunakan kode program JavaScript yang telah dikembangkan John Deck, Universitas California Berkeley. Penggunaan definisi sistem ini, menghasilkan rancangan arsitektur sistem, dan spesifikasi sistem yang lebih rinci.

Arsitektur Sistem

Arsitektur yang terbentuk terlihat seperti pada Gambar 8. Untuk penyajian petanya, sistem ini menggunakan Google Maps sebagai peta dasar dari semua layer. Data spasial berformat WMS nantinya akan diintegrasikan dengan menjadi sebuah layer yang menumpuk di atas peta dasar Google Maps.

`

CLIENT

HTML WITH

JAVASCRIPT OVERLAY OVERLAY KML WMS Google Maps

Gambar 8 Arsitektur sistem.

Selain mengintegrasikan data spasial berformat WMS, sistem ini juga dapat mengintegrasikan dengan data spasial berformat KML. Semua KML versi 2.0 yang terdapat pada berbagai situs, dapat ditampilkan di sistem ini. Integrasi kedua jenis

layer tersebut ditampilkan ke dalam browser

yang kompatibel terhadap kode-kode Google.

Spesifikasi Inkremen Sistem

Seperti yang telah dijelaskan sebelumnya, penelitian ini menggunakan kode program JavaScript yang telah dibuat John Deck, University California Berkeley. Penggunaan kode program ini mempunyai keterbatasan pada spesifikasi WMS yang digunakan. Keterbatasan tersebut adalah layanan WMS yang dipakai merupakan WMS dengan versi 1.1.1. Dengan demikian jika menggunakan WMS yang berbeda versinya, maka layer

tersebut tidak akan muncul atau saat dilakukan klik peta, tidak akan dilakukan operasi GetFeatureInfo. Operasi WMS yang diterapkan pada penelitian ini adalah GetMap, GetCapabilities, dan GetFeatureInfo. GetMap digunakan untuk mendapatkan peta WMS yang berupa layer untuk ditampilkan di atas peta Google Maps. Parameter yang diperlukan untuk mendapatkan petanya adalah alamat WMS, nama layer yang ingin ditampilkan serta format layer tersebut. GetCapabilities didapat dengan cara memasukkan alamat URL WMS, menghasilkan sebuah link, yang akan melakukan pengunduhan sebuah berkas XML yang isinya informasi-informasi WMS tersebut. Operasi tambahan lainnya yang digunakan pada penelitian ini adalah GetFeatureInfo. Operasi ini akan dijalankan ketika pengguna melakukan klik pada peta, menghasilkan informasi yang terdapat pada

(16)

6

Validasi Inkremen

Setelah pendefinisian ulang serta spesifikasi tersebut disepakati, dilakukan pengujian spesifikasi inkremen. Pengujian ini dilakukan dengan membuat sistem menjadi statis, yaitu terlebih dahulu parameter-parameternya didefinisikan. Setelah validnya hasil inkremen ini, dilakukan tahap pengembangan lebih lanjut.

Proses Floating Layer

Pada penelitian ini digunakan teknik yang ke dua, yakni layer WMS dijadikan floating layer atau tetap berada di atas dari semua jenis peta dasar Google Maps. Pada Gambar 9 dapat dilihat proses floating layer. Setelah permintaan pengguna tereksekusi, layer

tersebut akan terlihat pada peta menjadi tumpukan layer dengan peta dasar Google Maps selalu menempati urutan terbawah.

` BROWSER Objek layer terrain Hybrid sattelite Tipe Peta Google Maps Map GOOGLE WMS

Gambar 9 Ilustrasi floating layer.

Penggunaan JSON

JSON digunakan sebagai objek penampung layer yang telah diciptakan. Implementasi layer penampung hasil query

ditempatkan pada sebuah objek. Objek inilah yang merupakan bentuk dari JSON tersebut. Urutan penumpukan di floating layer

tergantung pada urutan pemanggilan layer

yang tercipta di JSON. Struktur JSON dapat dilihat pada Gambar 10.

Pada penelitian ini dibuat sebuah objek

bernama „layer‟ yang menampung objek -objek dari hasil query operasi WMS maupun integrasi KML. Penggunaan objek ini mampu mempercepat pemanggilan sebuah layer yang tercipta. Dengan begitu, JSON ini meningkatkan kinerja AJAX pada proses pengiriman datanya ke server Google untuk pemunculan layer.

GOOGLE FLOATING LAYER BASE MAP ` BROWSER OBJECT LAYER WMS KML

Gambar 10 Penggunaan JSON.

Integrasi dengan KML

Banyak institusi atau organisasi yang memiliki berkas KML yang disebarluaskan secara umum. KML ini merupakan teknik yang sangat sederhana untuk menampilkan data di dalam Google Maps sebagai GOverlay.

KML ini dibangun dengan membuat sebuah objek GeoXML (Google Server Upload). Objek tersebut digunakan untuk menspesifikasikan sebuah alamat menuju akses KML atau GeoRSS yang telah dipublikasi. Dengan menggunakan script yang ada di Google Maps, maka dari alamat tersebut akan tercipta sebuah layer yang akan menimpa peta dasar Google Maps sebagai

overlay layer. Seperti halnya integrasi dengan WMS, layer yang dihasilkan ini menjadi

overlay layer. Salah satu contoh KML adalah wikimapia. Wikimapia merupakan situs pencarian peta berupa nama-nama daerah yang telah ditandai oleh pengguna wikimapia. Wikimapia mempunyai data spasial berformat KML yang dapat diakses di

http://wikimapia.org/ge.kml. KML tersebut berisi data nama-nama daerah yang telah ditandai pada peta Google Maps.

Integrasi Inkremen Sistem

(17)

7

Pengujian Sistem

Pengujian dilakukan untuk melihat perbedaan lamanya waktu yang dibutuhkan memuat peta dari Google Maps maupun pemetaan lama yang menggunakan Chameleon. Pengujian dilakukan pada 22 Juni 2009 di BAKOSURTANAL sekitar pukul 10.36 WIB. Skenario pengujian yaitu dengan menampilkan layer bertema Batimetri provinsi Kalimantan Timur. Setelah ditampilkan layer, pengujian ke dua yaitu menghitung lamanya waktu untuk operasi

zoom. Hasil pengujian sistem dapat dilihat pada Gambar 11 dan Gambar 12.

Gambar 11 Pengujian pemuatan peta.

Gambar 12 Pengujian Operasi Zoom. Dari Gambar 11 dan Gambar 12, dapat dilihat bahwa penggunaan Google Maps sebagai penyaji peta dasar sangat membantu dalam mengurangi lamanya pemunculan layer tema ke dalam sistem pemetaan yang dibuat. Hasil berupa tabel dapat dilihat pada Lampiran.

Evaluasi Sistem

Evaluasi dilakukan di BAKOSURTANAL di hadapan pengguna Ibu Suzan N. Gill, S.Kom, Bapak Dr. Gatot Pramono, Bapak Suseno, S.T, dan Ibu Ati Rahadiyati, M.Sc. Pada tahap ini dilakukan simulasi percobaan pada sistem. Sistem pemetaan telah berhasil mengintegrasikan serta menampilkan layer

hasil query operasi WMS. Pengintegrasian dengan KML juga berhasil menampilkan

layer. Namun, ketika operasi GetFeatureInfo dijalankan (saat klik layer WMS), WMS tidak

menampilkan informasi secara detail, seperti pada Gambar 13. Lain halnya pengujian terhadap alamat WMS

http://thewildwoodstudios.com/cgi-bin/mapserv?map=../roadlessland/maps/ira.ma p&, akan menampilkan informasi layer secara rinci seperti pada Gambar 14. Hal ini dikarenakan struktur WMS Bakosurtanal berbeda dengan struktur WMS pada umumnya sehingga operasi GetFeaturInfo saat dilakukan tidak mengeluarkan keluaran informasi layer.

Gambar 13 GetFeatureInfo pada layer WMS.

Gambar 14 GetFeatureInfo pada layer

roadlessland.

KESIMPULAN DAN SARAN

Kesimpulan

(18)

8 pemetaan sebelumnya yang menggunakan

Saran

Penelitian ini sudah diintegrasikan dengan sistem yang telah ada. Hasil pengintegrasian ini dapat dilihat pada

http://pssdal.bakosurtanal.go.id, yaitu pada katalog data spasial BAKOSURTANAL. Ketika diintegrasikan dengan sistem tersebut, ternyata ada beberapa WMS dari beberapa tema yang tidak muncul dan query

GetFeatureInfo tidak mengembalikan informasi yang diminta. Hal ini dikarenakan format WMS yang digunakan tidak mengikuti standar OGC-WMS. Saran dari penelitian ini adalah memperbaiki format WMS yang ada dengan mengikuti standar dari OGC-WMS.

DAFTAR PUSTAKA

[OGC] (Open Geospatial Consortium, Inc). 2005. Web Map Service Implementation Specification, 01-047r2.

[OGC] (Open Geospatial Consortium, Inc). 2007. KML, 07-147r2.

Dubost, K. 2003. Drafft-Gift or PNG. W3C :

http://www.w3.org/QA/Tips/png-gif Eric, P. 2009. Mashup Mania With Google

Maps. Geospatial Training services, LLC.

Goodman, D. 2004. Javascript Bible. Ed ke-5. Google Maps API Developer. 2008.

[http://googlemapsapi.blogspot.com]. Guda, N. 2008. Publishing Large Datasets on

Google Maps.

[http://roadlessland.org/notes/index.html

]

Gunther, GL. 2008. Introduction to the Google Maps API. USGS GIS Workshop 2008.

Jesse J. 2005. Ajax: A new Approach to Web

Applications, from

(http://adaptivepath.com/publications/es says/archives/000385.php)

O‟Reilly. 2006. HTML & XHTML Quick reference. Ed ke-6. O‟Reilly Media, Inc. Prahasta, E. 2007. MembangunAplikasi

Web-based GIS dengan MapServer.

Informatika. Bandung 2006.

Sayar, A. 2005. Architecture of the Integration of Google and OGC WMS Web services. Computer Science Department. Indiana University.

Shin, S. 2007. Introduction To JSON. Java Technology Architect: Sun Microsystem, Inc.

(19)

9

(20)

10 Lampiran 1Arsitektur GMRIS-MCRMP

DATA VEKTOR

DATA RASTER

MAPSERVER Chameleon

DATA MEDIA

(21)

(22)

12 Lampiran 3 Hasil pengujian

percobaan pemuatan awal zoom

Chameleon Google Maps Chameleon Google Maps

1 7.7 2.43 7.42 2.09

2 8.62 3.1 6.6 3.42

3 15.78 2.5 7 2

4 8.42 2.34 6.64 1.35

5 8 2.06 7.32 1

6 7.6 3.7 6.31 1.75

7 8.32 5 7.15 2.5

8 8.6 3 7.29 2.5

9 10.31 6.45 7.43 1.57

10 11.28 4.26 6.78 1.81

11 8.84 3.14 7.46 1.51

12 10 3 7.87 1

13 10 4.51 7.35 1.31

14 10 4.12 7.56 1

15 10 4.64 7.31 1

16 10 3.67 10.7 1.31

17 8.68 2.92 8.79 1.4

18 9.46 3.28 7.34 1.56

19 9 2.54 9.2 1.32

20 8.62 3.93 8 1.34

(23)

9

(24)

10 Lampiran 1Arsitektur GMRIS-MCRMP

DATA VEKTOR

DATA RASTER

MAPSERVER Chameleon

DATA MEDIA

(25)

(26)

12 Lampiran 3 Hasil pengujian

percobaan pemuatan awal zoom

Chameleon Google Maps Chameleon Google Maps

1 7.7 2.43 7.42 2.09

2 8.62 3.1 6.6 3.42

3 15.78 2.5 7 2

4 8.42 2.34 6.64 1.35

5 8 2.06 7.32 1

6 7.6 3.7 6.31 1.75

7 8.32 5 7.15 2.5

8 8.6 3 7.29 2.5

9 10.31 6.45 7.43 1.57

10 11.28 4.26 6.78 1.81

11 8.84 3.14 7.46 1.51

12 10 3 7.87 1

13 10 4.51 7.35 1.31

14 10 4.12 7.56 1

15 10 4.64 7.31 1

16 10 3.67 10.7 1.31

17 8.68 2.92 8.79 1.4

18 9.46 3.28 7.34 1.56

19 9 2.54 9.2 1.32

20 8.62 3.93 8 1.34

(27)

1

PENDAHULUAN

Latar Belakang

Seiring berkembangnya era teknologi informasi serta kebutuhan data yang semakin bertambah, Sistem Informasi Geografis (SIG) kini dirancang sedemikian rupa agar bisa diakses oleh seluruh pengguna di mana saja, secara interaktif, dan tanpa harus bertemu secara fisik antara satu pengguna dengan pengguna lainnya (Prahasta 2006). Sehubungan dengan maraknya kebutuhan esensial ini, sudah banyak institusi yang menyediakan data terkait, baik secara komersial maupun non-komersial.

BAKOSURTANAL saat ini telah membangun suatu sistem pemetaan data berbasis internet Geografis Marine Resource information System – Marine and Coastal Resource Management Project (GMRIS-MCRMP). Sistem ini menghubungkan data spasial dengan data Bappeda tingkat provinsi. Sistem GMRIS–MCRMP ini menggunakan MapServer sebagai Map Engine dan

framework Chameleon. Data vektor yang digunakan adalah shapefile, sedangkan data rasternya berformat JPEG. Arsitektur GMRIS-MCRMP dapat dilihat pada Lampiran 1. Sistem yang dibangun BAKOSURTANAL ini mempunyai keterbatasan kecepatan tampilan dan background citra yang tidak seamless

(tidak kontinu). Pada kasus uji yang dilakukan di BAKOSURTANAL ditampilkan peta administrasi kabupaten di provinsi Kalimantan Tengah dengan waktu loading

untuk menampilkan petanya sekitar 1 detik pada saat awal (Gambar 1). Ketika dilakukan operasi zoom, peta tampil dalam waktu sekitar 2 detik (Gambar 2). Pada saat dilakukan operasi pergeseran koordinat, peta tampil dengan waktu loading sekitar 2 detik dan citra tersebut tidak seamless (Gambar 3).

Gambar 1 Tampilan peta saat awal pemuatan.

Gambar 2 Tampilan saat operasi zoom.

Gambar 3 Tampilan saat digeser.

Institusi penyedia data seperti BAKOSURTANAL secara khusus, menyebarkan datanya melalui WMS (Web Map Service). Dengan WMS, setiap pengguna dapat mengakses data spasial yang tersebar di berbagai server yang berbeda, seperti pada BAKOSURTANAL dan kemudian memanfaatkannya untuk membentuk komposisi petanya sendiri.

(28)

2

Tujuan

Ruang Lingkup

TINJAUAN PUSTAKA

Google Maps

GetCapabilities

GetMap

GetFeatureInfo

Keyhole Markup Language (KML)

KML.

Wikimapia

AJAX

(29)

2

Tujuan

Ruang Lingkup

TINJAUAN PUSTAKA

Google Maps

GetCapabilities

GetMap

GetFeatureInfo

Keyhole Markup Language (KML)

KML.

Wikimapia

AJAX

(30)

2005).

JavaScript Object Notation (JSON)

[image:30.595.118.298.238.325.2]

METODE PENELITIAN

Metode Prototipe

[image:30.595.103.499.540.716.2]

(31)

2005).

JavaScript Object Notation (JSON)

[image:31.595.118.298.238.325.2]

METODE PENELITIAN

Metode Prototipe

[image:31.595.103.499.540.716.2]

(32)

Pendaftaran Sistem

[image:32.595.115.308.356.474.2]

HASIL DAN PEMBAHASAN

Lingkungan Pengembangan

2. RAM 2 GB

2. KML versi 2.0

Definisi Sistem Pertama

(33)

Pendaftaran Sistem

[image:33.595.115.308.356.474.2]

HASIL DAN PEMBAHASAN

Lingkungan Pengembangan

2. RAM 2 GB

2. KML versi 2.0

Definisi Sistem Pertama

(34)

5 kode script, yaitu ke WMS

[image:34.595.323.502.81.208.2]

BAKOSURTANAL dan ke server Google.

Gambar 7 Uji coba OpenLayers. Pada Gambar 7 dapat dilihat bahwa untuk menampilkan komposisi petanya, OpenLayers membutuhkan waktu yang lebih lama dibandingkan dengan tanpa pemakaian OpenLayers. Oleh karena itu, pengembangan selanjutnya memakai JavaScript Google Maps API.

Validasi Pertama

Pengajuan sistem menggunakan OpenLayers ini ditolak oleh pengguna. Pengguna tersebut adalah Dr. Gatot Pramono, yang merupakan pengembang sistem GMRIS-MCRMP. Dengan tidak validnya sistem ini sesuai dengan keinginan pengguna, maka spesifikasi tersebut diulang dari tahap awal, dengan tidak menggunakan OpenLayers.

Google Maps API

Pendefinisan sistem yang ke dua meninggalkan pemakaian OpenLayers dan menggunakan secara penuh pemrogaman

Google Maps API. Dengan pemakaian kode-kode yang diberikan Google Maps API ini, peta Google Map dapat diintegrasikan dengan format WMS maupun KML. Pada tahap ini, integrasi WMS dengan Google Maps menggunakan kode program JavaScript yang telah dikembangkan John Deck, Universitas California Berkeley. Penggunaan definisi sistem ini, menghasilkan rancangan arsitektur sistem, dan spesifikasi sistem yang lebih rinci.

Arsitektur Sistem

Arsitektur yang terbentuk terlihat seperti pada Gambar 8. Untuk penyajian petanya, sistem ini menggunakan Google Maps sebagai peta dasar dari semua layer. Data spasial berformat WMS nantinya akan diintegrasikan dengan menjadi sebuah layer yang menumpuk di atas peta dasar Google Maps.

`

CLIENT

HTML WITH

JAVASCRIPT OVERLAY OVERLAY KML WMS Google Maps

Gambar 8 Arsitektur sistem.

Selain mengintegrasikan data spasial berformat WMS, sistem ini juga dapat mengintegrasikan dengan data spasial berformat KML. Semua KML versi 2.0 yang terdapat pada berbagai situs, dapat ditampilkan di sistem ini. Integrasi kedua jenis

layer tersebut ditampilkan ke dalam browser

yang kompatibel terhadap kode-kode Google.

Spesifikasi Inkremen Sistem

Seperti yang telah dijelaskan sebelumnya, penelitian ini menggunakan kode program JavaScript yang telah dibuat John Deck, University California Berkeley. Penggunaan kode program ini mempunyai keterbatasan pada spesifikasi WMS yang digunakan. Keterbatasan tersebut adalah layanan WMS yang dipakai merupakan WMS dengan versi 1.1.1. Dengan demikian jika menggunakan WMS yang berbeda versinya, maka layer

tersebut tidak akan muncul atau saat dilakukan klik peta, tidak akan dilakukan operasi GetFeatureInfo. Operasi WMS yang diterapkan pada penelitian ini adalah GetMap, GetCapabilities, dan GetFeatureInfo. GetMap digunakan untuk mendapatkan peta WMS yang berupa layer untuk ditampilkan di atas peta Google Maps. Parameter yang diperlukan untuk mendapatkan petanya adalah alamat WMS, nama layer yang ingin ditampilkan serta format layer tersebut. GetCapabilities didapat dengan cara memasukkan alamat URL WMS, menghasilkan sebuah link, yang akan melakukan pengunduhan sebuah berkas XML yang isinya informasi-informasi WMS tersebut. Operasi tambahan lainnya yang digunakan pada penelitian ini adalah GetFeatureInfo. Operasi ini akan dijalankan ketika pengguna melakukan klik pada peta, menghasilkan informasi yang terdapat pada

[image:34.595.119.301.86.230.2]

(35)

6

Validasi Inkremen

Setelah pendefinisian ulang serta spesifikasi tersebut disepakati, dilakukan pengujian spesifikasi inkremen. Pengujian ini dilakukan dengan membuat sistem menjadi statis, yaitu terlebih dahulu parameter-parameternya didefinisikan. Setelah validnya hasil inkremen ini, dilakukan tahap pengembangan lebih lanjut.

Proses Floating Layer

Pada penelitian ini digunakan teknik yang ke dua, yakni layer WMS dijadikan floating layer atau tetap berada di atas dari semua jenis peta dasar Google Maps. Pada Gambar 9 dapat dilihat proses floating layer. Setelah permintaan pengguna tereksekusi, layer

tersebut akan terlihat pada peta menjadi tumpukan layer dengan peta dasar Google Maps selalu menempati urutan terbawah.

[image:35.595.325.486.96.211.2]

` BROWSER Objek layer terrain Hybrid sattelite Tipe Peta Google Maps Map GOOGLE WMS

Gambar 9 Ilustrasi floating layer.

Penggunaan JSON

JSON digunakan sebagai objek penampung layer yang telah diciptakan. Implementasi layer penampung hasil query

ditempatkan pada sebuah objek. Objek inilah yang merupakan bentuk dari JSON tersebut. Urutan penumpukan di floating layer

tergantung pada urutan pemanggilan layer

yang tercipta di JSON. Struktur JSON dapat dilihat pada Gambar 10.

Pada penelitian ini dibuat sebuah objek

bernama „layer‟ yang menampung objek -objek dari hasil query operasi WMS maupun integrasi KML. Penggunaan objek ini mampu mempercepat pemanggilan sebuah layer yang tercipta. Dengan begitu, JSON ini meningkatkan kinerja AJAX pada proses pengiriman datanya ke server Google untuk pemunculan layer.

[image:35.595.114.302.328.469.2]

GOOGLE FLOATING LAYER BASE MAP ` BROWSER OBJECT LAYER WMS KML

Gambar 10 Penggunaan JSON.

Integrasi dengan KML

Banyak institusi atau organisasi yang memiliki berkas KML yang disebarluaskan secara umum. KML ini merupakan teknik yang sangat sederhana untuk menampilkan data di dalam Google Maps sebagai GOverlay.

KML ini dibangun dengan membuat sebuah objek GeoXML (Google Server Upload). Objek tersebut digunakan untuk menspesifikasikan sebuah alamat menuju akses KML atau GeoRSS yang telah dipublikasi. Dengan menggunakan script yang ada di Google Maps, maka dari alamat tersebut akan tercipta sebuah layer yang akan menimpa peta dasar Google Maps sebagai

overlay layer. Seperti halnya integrasi dengan WMS, layer yang dihasilkan ini menjadi

overlay layer. Salah satu contoh KML adalah wikimapia. Wikimapia merupakan situs pencarian peta berupa nama-nama daerah yang telah ditandai oleh pengguna wikimapia. Wikimapia mempunyai data spasial berformat KML yang dapat diakses di

http://wikimapia.org/ge.kml. KML tersebut berisi data nama-nama daerah yang telah ditandai pada peta Google Maps.

Integrasi Inkremen Sistem

(36)

7

[image:36.595.348.484.214.343.2]

[image:36.595.113.302.255.503.2]

Evaluasi Sistem

roadlessland.

KESIMPULAN DAN SARAN

Kesimpulan

[image:36.595.342.490.377.494.2]

(37)

7

[image:37.595.348.484.214.343.2]

[image:37.595.113.302.255.503.2]

Evaluasi Sistem

roadlessland.

KESIMPULAN DAN SARAN

Kesimpulan

[image:37.595.342.490.377.494.2]

(38)

8 pemetaan sebelumnya yang menggunakan

Saran

Penelitian ini sudah diintegrasikan dengan sistem yang telah ada. Hasil pengintegrasian ini dapat dilihat pada

http://pssdal.bakosurtanal.go.id, yaitu pada katalog data spasial BAKOSURTANAL. Ketika diintegrasikan dengan sistem tersebut, ternyata ada beberapa WMS dari beberapa tema yang tidak muncul dan query

GetFeatureInfo tidak mengembalikan informasi yang diminta. Hal ini dikarenakan format WMS yang digunakan tidak mengikuti standar OGC-WMS. Saran dari penelitian ini adalah memperbaiki format WMS yang ada dengan mengikuti standar dari OGC-WMS.

DAFTAR PUSTAKA

[OGC] (Open Geospatial Consortium, Inc). 2005. Web Map Service Implementation Specification, 01-047r2.

[OGC] (Open Geospatial Consortium, Inc). 2007. KML, 07-147r2.

Dubost, K. 2003. Drafft-Gift or PNG. W3C :

http://www.w3.org/QA/Tips/png-gif Eric, P. 2009. Mashup Mania With Google

Maps. Geospatial Training services, LLC.

Goodman, D. 2004. Javascript Bible. Ed ke-5. Google Maps API Developer. 2008.

[http://googlemapsapi.blogspot.com]. Guda, N. 2008. Publishing Large Datasets on

Google Maps.

[http://roadlessland.org/notes/index.html

]

Gunther, GL. 2008. Introduction to the Google Maps API. USGS GIS Workshop 2008.

Jesse J. 2005. Ajax: A new Approach to Web

Applications, from

(http://adaptivepath.com/publications/es says/archives/000385.php)

O‟Reilly. 2006. HTML & XHTML Quick reference. Ed ke-6. O‟Reilly Media, Inc. Prahasta, E. 2007. MembangunAplikasi

Web-based GIS dengan MapServer.

Informatika. Bandung 2006.

Sayar, A. 2005. Architecture of the Integration of Google and OGC WMS Web services. Computer Science Department. Indiana University.

Shin, S. 2007. Introduction To JSON. Java Technology Architect: Sun Microsystem, Inc.