Tag: openlayers

Membuat peta tematik di web dengan openlayers [Bagian 7: Kelas otomatis ]

Pada contoh-contoh sebelumnya kita menggunakan pengelompokan kelas yang kita definisikan sendiri. Hal ini tentunya sangat merepotkan jika kita meng handle banyak peta. Karenanya kita akan mencoba membuat kategori yang otomatis berdasarkan data. Algoritma yang paling sederhana adalah Equal Breaks, dimana hanya membagi range dari data dengan jumlah klasifikasi yang diinginkan. Berikut ini adalah contoh algoritma equal breaks:

Continue reading “Membuat peta tematik di web dengan openlayers [Bagian 7: Kelas otomatis ]”

Advertisements

Membuat peta tematik di web dengan openlayers [Bagian 6: Menghubungkan dengan database ]

Pada bagian-bagian sebelumnya, data ditulis dalam array di javascript. Lalu bagaimana kalau mau me-load data yang ada di database? Untuk keperluan itu, kita tidak bisa menggunakan javascript, karena java script hanya jalan di client/browser (client-side). Kita butuh bahasa pemrograman server-side yang bisa mengakses ke database. Dalam hal ini kita akan mencoba memakai bahasa pemrograman PHP dengan data base MySql.

Database dari MySql akan kita query melalui PHP dan kita simpan ke dalam array di PHP. Selanjutnya array di PHP tersebut kita transfer ke javascript. Cara yang termudah adalah menggunakan fungsi json_encode() pada PHP. Fungsi ini akan mengubah array PHP menjadi format JSON (Javascript Object Notation). Sebagai contoh array PHP berikut ini:

$warnakelas = array("#EEFFFF", "#6DD5FF", "#19A3FF", "#0048FF");

Akan diubah menjadi

["#EEFFFF","#6DD5FF","#19A3FF","#0048FF"]

Pada contoh ini akan kita gunakan database MySql yang menyimpan data jumlah penduduk. Berikut ini contoh datanya:

Continue reading “Membuat peta tematik di web dengan openlayers [Bagian 6: Menghubungkan dengan database ]”

Membuat peta tematik di web dengan openlayers [Bagian 5: Mengkustomisasi peta]

Di bagian ini kita akan coba mengkustomisasi tampilan peta, seperti menampilkan skala dan koordinat, serta menampilkan label. Untuk menampilkan skala dan koordinat, openlayers menyediakan contol bawaan yang bisa di munculkan ke peta. Terdapat beberapa macam control yang disediakan, misalnya OverviewMapPanZoomBarLayerSwitcher, dsb. Selengkapnya bisa dilihat di. http://dev.openlayers.org/docs/files/OpenLayers/Control-js.html

Cara menambahkannya adalah dengan menambahkan code pada saat menginisialisasi object Map, seperti contoh berikut:

Continue reading “Membuat peta tematik di web dengan openlayers [Bagian 5: Mengkustomisasi peta]”

Membuat peta tematik di web dengan openlayers [Bagian 4: Style warna berdasarkan data]

Setelah bisa meng-custom warna dari tampilan peta, lalu bagaimana kalau warna nya di set berdasarkan data? Openlayers menyediakan fitur context untuk keperluan tersebut. Pada sesi ini kita coba simpan data nya dalam format array di javascript. Diperlukan juga batas-batas kelas yang mewakili range data, beserta warna yang mewakili. Kita akan coba gunakan data kepadatan penduduk untuk kabupaten/kota di Provinsi DI Yogyakarta.

Data kepadatan penduduk tersebut adalah :

  • [3401] Kulon Progo : 663 jiwa/km2
  • [3402] Bantul : 1794 jiwa/km2
  • [3403] Gunung Kidul : 472 jiwa/km2
  • [3404] Sleman : 1902 jiwa/km2
  • [3471] Kota Yogyakarta : 11958 jiwa/km2

Kita akan klasifikasikan ke 4 kelas dengan memberi warna (warna didefinisikan dalam kode heksadesimal):

  • 0 – 499 jiwa/km2  -> #EEFFFF
  • 500 – 999 jiwa/km2 -> #6DD5FF
  • 1000 – 1999 jiwa/km2 -> #19A3FF
  • >= 2000 jiwa/km2 -> #0048FF

Continue reading “Membuat peta tematik di web dengan openlayers [Bagian 4: Style warna berdasarkan data]”

Membuat peta tematik di web dengan openlayers [Bagian 2: Meload file GML ke openlayers]

Langkah selanjutnya setelah file GML siap. Akan kita coba menampilkan file tersebut di library openlayers. Untuk memudahkannya, setelah download library openlayers dari webnya, terdapat file sample untuk meload file GML. Kita tinggal mengedit file tersebut (terletak di folder examples file gml-layer.html). Berikut ini kurang lebih isi filenya (hanya diambil kode javascript nya):

Continue reading “Membuat peta tematik di web dengan openlayers [Bagian 2: Meload file GML ke openlayers]”

Membuat peta tematik di web dengan openlayers [Bagian 1: Menyiapkan peta]

Ini adalah dokumentasi langkah-langkah untuk membuat peta tematik menggunakan openlayers. Bagian pertama adalah penyiapan peta.

Peta yang dihasilkan biasanya menggunakan format ESRI Shapefile (.shp) karena pengolahannya menggunakan sofware dari ESRI baik ArcView atau ArcGIS. Sayangnya openlayers tidak mendukung shapefile sebagai sumber data vektor, sehingga perlu dilakukan modifikasi sumber data-nya. Bisa dengan mendeploy server GIS dengan tool-tool advance spt ArcGIS Server, MapServer, PostGIS, deesbe, atau bisa dengan cara simple yaitu mengkonversi file nya ke format yg disupport openlayers (KML dan GML). Saya sendiri memilih untuk mengkonversi peta ke format GML karena lebih simple.

Ada satu hal yang perlu diingat kalau memilih cara ini, file shp bisa berukuran gede banget bisa ber mega-mega atau beratus-ratus megabyte. Tentunya tidak cocok untuk di web (bisa makan waktu sejam untuk pengunjung bisa nampilin peta dengan ukuran jumbo). Itulah kenapa diperlukan proses lain yg disebut simplifying untuk mengecilkan ukuran peta sehingga ‘pantas’ untuk ditaruh di web.

Continue reading “Membuat peta tematik di web dengan openlayers [Bagian 1: Menyiapkan peta]”