MEMBUAT WEBGIS DENGAN LEAFLET JAVASCRIPT PART 1

Assalamualaikum Wr.Wb

Artikel ini akan membahas tutorial membuat Website berbasis GIS (Geographic Information System), atau yang lebih dikenal dengan sebutan WebGIS. Dalam proses pembuatannya akan digunakan aplikasi GeoServer, PostgreSQL dan library Leaflet JavaScript. Untuk pengertian serta fungsi dari setiap tools yang digunakan sudah pernah di jelaskan di artikel berikut :
Dalam tahap pertama ini, akan digunakan contoh vektor untuk daerah Provinsi Bali yang bisa di unduh di link berikut :
Atau dapat juga menggunakan data lain yang dapat di unduh di link artikel berikut :
Pada proses pembuatan WebGIS ini, data vektor akan disimpan di database di PostgreSQL yang tujuannya agar penyimpanan data lebih rapih dan terstruktur, kemudian proses memasukan data vektor ke database akan dilakukan dengan cara import dengan menggunakan software Quantum GIS. Data yang sudah ada di dalam database akan dikoneksikan ke GeoServer dan dari GeoServer tersebut akan di panggil link dalam format GeoJson ke dalam script penyusun WebGIS.
Jadi intinya maksud dari tahapan-tahapan ini agar proses pertukaran serta alur data menjadi dinamis, serta efisien. Ketika akan memperbaharui atau menambah data, cukup dilakukan satu kali di software Quantum GIS yang terkoneksi ke PostgreSQL, nanti ketika halaman WebGIS di tampilkan maka data vektor akan otomatis sudah diperbaharui sesuai dengan yang ada di database.
Proses Alur Data
Proses Alur Data
Pertama jalankan Quantum GIS dan PostgreSQL kemudian import data SHP ke dalam database di PostgreSQL, caranya sudah pernah dibahas di artikel berikut :
Kemudian koneksikan database tersebut ke GeoServer, dan cara koneksi database di PostgreSQL ke GeoServer juga sudah pernah dibahas di artikel berikut :
Cara untuk koneksi ke GeoServer akan sedikit saya ulangi, setelah Program PgAdminIII (PostgreSQL) di jalankan kemudian jalankan juga program GeoServer kemudian akses dan login ke dalamnya.
Buat workspace baru, di sini workspace di beri nama "info-geospasial" kemudian masuk ke menu stores > add new store > PostGIS. Kemudian isikan settingan untuk koneksi ke database di PostgreSQL seperti berikut :
Koneksi ke database di PostgreSQL
Koneksi ke database di PostgreSQL
Setelah berhasil maka akan muncul daftar layer yang ada di dalam database tersebut, seperti berikut :
Daftar Layer dari database
Daftar Layer dari database
Berikutnya lakukan publikasi pada layer tersebut, dengan mengklik pilihan Publish. Lakukan settingan untuk publikasi kurang lebih seperti gambar berikut :
Settingan untuk publikasi Layer di GeoServer
Settingan untuk publikasi Layer di GeoServer
Untuk penjelasan setiap form isian dapat di baca dan di pahami di artikel Koneksi PostgreSQL ke GeoServer
Setelah tahapan di atas di lakukan, sekarang masuk ke menu Layer Preview kemudian coba tampilkan layer yang barusan di Publish (Layer Bali) ke dalam tampilan OpenLayer.
Layer Preview
Layer Preview
Layer Bali di dalam tampilan OpenLayer
Layer Bali di dalam tampilan OpenLayer
Pada gambar di atas terlihat objek pulau Bali yang muncul dalam tampilan OpenLayer di GeoServer, berarti proses koneksi database ke GeoServer berjalan dengan benar. Selanjutnya kembali ke Layer Preview lalu tampilkan Layer Bali ke dalam tampilan GeoJSON.
GeoJSON Layer Bali
GeoJSON Layer Bali
Sekarang masuk ke tahap pembuatan WebGIS. Tahap sebelumnya merupakan tahap untuk mempersiapkan data yang dibutuhkan. Sebelumnya pastikan di laptop/PC yang digunakan sudah terinstal program XAMPP yang berfungsi agar dapat menjalankan website berbasis PHP. Karena WebGIS yang akan kita buat akan dibangun dengan beberapa bahasa pemrograman.
Softwarenya sendiri dapat di unduh dengan bebas di web resminya, untuk cara instalasi tidak akan dijelaskan di artikel ini, silahkan cari sendiri caranya di internet.
Admin asumsikan bahwa program XAMPP sudah berhasil terinstal di laptop/PC yang digunakan, sekarang buat folder di directory instalasi XAMPP, yaitu di XAMPP > htdocs. Buat folder WebGIS kemudian di dalamnya buat lagi folder untuk nama dari web yang dibuat (bebas) sebagai contoh di sini nama foldernya adalah "info-geospasial".
Di dalam folder "info-geospasial" buat lagi beberapa folder diantaranya :
css, js, img, layer, leaflet
Susunan folder di dalam folder "info-geospasial"
Susunan folder di dalam folder "info-geospasial"
Sekarang jalankan program XAMPP kemudian run pada server Apache. Buka text editor bisa pakai notepad, notepad ++, sublime, ataupun text editor lainnya.
Copy link address pada halaman Layer Bali yang ditampilkan ke dalam format GeoJSON (perhatihan gambar tampilan halaman GeoJSON, khususnya di bagian link address. Copy link tersebut). Di dalam text editor buat file baru dengan nama request_bali.php dan di dalamnya isi dengan syntax seperti berikut :

<?php
$url=file_get_contents("http://localhost:3615/geoserver/info-geospasial/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=info-geospasial:BALI_ADM&outputFormat=application%2Fjson");  
	# url yang ada di dalam ("") itu link address dari halaman GeoJSON.. jangan luap hapus bagian &maxFeatures=50
echo($url);
?>
save file tesebut di dalam folder layer di dalam folder info-geospasial. Tahap selanjutnya membuat halaman utama WebGIS. Buat file index.php kemudian isi dengan strukut dasar html seperti berikut :
<!DOCTYPE html>
<html>
<head> <!-- untuk meta description, keywords, dan author bisa gantu dan di sesuaikan tapi yang meta charset sama viewport jangan di ganti -->
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name='description' content='WebGIS info-geospasial.com menyajikan berbagai konten spasial ke dalam bentuk Website'/>
<meta name='keywords' content='WebGIS, WebGIS info-geospasial, WebGIS Indoensia'/>
<meta name='Author' content='Egi Septiana'/> 
<title>WebGIS Info-Geospasial</title> <!-- title bisa di sesuaikan dengan nama judul WebGIS yang di inginkan -->
</head>
<body>
<!-- bagian ini akan di isi konten utama -->
</body>
</html>
Simpan file index.php tersebut di bagian luar di folder info-geospasial. Selanjutnya tambahakan file plugin leaflet JavaScript berikut di folder leaflet.
Silahkan unduh terlebih dahulu kemudian ekstrak dan simpan di folder leaflet. Unduh juga file jQuery di link berikut :
Untuk plugin leafletJS unduh yang legacy atau stable version. dan untuk jQuery unduh yang versi compressed. Simpan file jQuery di folder js. Di dalam file index.php tepat di atas tag head
tambahakan link pemanggil CSS, dan JS seperti berikut :

<link rel="stylesheet" href="leaflet/leaflet.css" /> <!-- memanggil css di folder leaflet -->
<script src="leaflet/leaflet.js"></script> <!-- memanggil leaflet.js di folder leaflet -->
<script src="js/jquery-3.1.0.min.js"></script> <!-- memanggil jquery di folder js -->
<script src="leaflet/leaflet-providers-master/leaflet-providers.js"></script> <!-- memanggil leaflet-providers.js di folder leaflet provider -->
Selanjutnya di dalam tag body buat sebuat syntax id="map" dan di dalamnya isi dengan JavaScript untuk memanggil peta ke dalam halaman Web. Berikut syntax nya :

<div id="map"> <!-- ini id="map" bisa di ganti dengan nama yang di inginkan -->
<script>
// MENGATUR TITIK KOORDINAT TITIK TENGAN & LEVEL ZOOM PADA BASEMAP
var map = L.map('map').setView([-8.4521135,115.0599022], 10);

// PILIHAN BASEMAP YANG AKAN DITAMPILKAN
var baseLayers = {  
  'Esri.WorldTopoMap': L.tileLayer.provider('Esri.WorldTopoMap').addTo(map),
  'Esri WorldImagery': L.tileLayer.provider('Esri.WorldImagery')
};

// MENAMPILKAN TOOLS UNTUK MEMILIH BASEMAP
L.control.layers(baseLayers,{}).addTo(map);
// MENAMPILKAN SKALA
L.control.scale({imperial: false}).addTo(map);

// ------------------- VECTOR ----------------------------
// REQUEST BALI ADMINISTRASI
$.ajax({ // ini perintah syntax ajax untuk memanggil vektor
    type: 'POST',
    url: 'layer/request_bali.php', // INI memanggil link request_bali yang sebelumnya telah di buat
    dataType: "json",
	success: function(response){
  	var data=response; 
  	L.geoJson(data,{
     style: function(feature){
    var Style1
    return { color: "#cc3f39", weight: 1, opacity: 1 }; // ini adalah style yang akan digunakan
    },
      // MENAMPILKAN POPUP DENGAN ISI BERDASARKAN ATRIBUT KAB_KOTA
      onEachFeature: function( feature, layer ){
        layer.bindPopup( "<center>" + feature.properties.kab_kot + "</center>")
      }
      }).addTo(map);  // di akhir selalu di akhiri dengan perintah ini karena objek akan ditambahkan ke map
    }
});
</script>
</div> 
Kemudian buat file style.css dan simpan di folder css, isi file tersebut dengan syntax berikut :
 html {
  height: 100% 
 }
 body { 
  height: 100%; 
  margin: 0; 
  padding: 0;
 }
 #map {
  height:100%; 
} 
Terakhir tambahkan link pemanggil file style.css tersebut ke file index.php, tempatkan di bawah syntax pemanggil CSS leaflet.
<link rel="stylesheet" href="css/style.css" /> <!-- memanggil css style -->
Setelah semua tahapan di atas diikuti, maka berikut hasil akhir setelah di gabungkan semuanya :

<!DOCTYPE html>
<html>
<head> <!-- untuk meta description, keywords, dan author bisa gantu dan di sesuaikan tapi yang meta charset sama viewport jangan di ganti -->
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name='description' content='WebGIS info-geospasial.com menyajikan berbagai konten spasial ke dalam bentuk Website'/>
<meta name='keywords' content='WebGIS, WebGIS info-geospasial, WebGIS Indoensia'/>
<meta name='Author' content='Egi Septiana'/> 
<title>WebGIS Info-Geospasial</title> <!-- title bisa di sesuaikan dengan nama judul WebGIS yang di inginkan -->
<link rel="stylesheet" href="leaflet/leaflet.css" /> <!-- memanggil css di folder leaflet -->
<link rel="stylesheet" href="css/style.css" /> <!-- memanggil css style -->
<script src="leaflet/leaflet.js"></script> <!-- memanggil leaflet.js di folder leaflet -->
<script src="js/jquery-3.1.0.min.js"></script> <!-- memanggil jquery di folder js -->
<script src="leaflet/leaflet-providers-master/leaflet-providers.js"></script> <!-- memanggil leaflet-providers.js di folder leaflet provider -->
</head>
<body>
<div id="map"> <!-- ini id="map" bisa di ganti dengan nama yang di inginkan -->
<script>
// MENGATUR TITIK KOORDINAT TITIK TENGAN & LEVEL ZOOM PADA BASEMAP
var map = L.map('map').setView([-8.4521135,115.0599022], 10);

// PILIHAN BASEMAP YANG AKAN DITAMPILKAN
var baseLayers = {  
  'Esri.WorldTopoMap': L.tileLayer.provider('Esri.WorldTopoMap').addTo(map),
  'Esri WorldImagery': L.tileLayer.provider('Esri.WorldImagery')
};

// MENAMPILKAN TOOLS UNTUK MEMILIH BASEMAP
L.control.layers(baseLayers,{}).addTo(map);
// MENAMPILKAN SKALA
L.control.scale({imperial: false}).addTo(map);

// ------------------- VECTOR ----------------------------
// REQUEST BALI ADMINISTRASI
$.ajax({ // ini perintah syntax ajax untuk memanggil vektor
    type: 'POST',
    url: 'layer/request_bali.php', // INI memanggil link request_bali yang sebelumnya telah di buat
    dataType: "json",
	success: function(response){
  	var data=response; 
  	L.geoJson(data,{
     style: function(feature){
    var Style1
    return { color: "#cc3f39", weight: 1, opacity: 1 }; // ini adalah style yang akan digunakan
    },
      // MENAMPILKAN POPUP DENGAN ISI BERDASARKAN ATRIBUT KAB_KOTA
      onEachFeature: function( feature, layer ){
        layer.bindPopup( "<center>" + feature.properties.kab_kot + "</center>")
      }
      }).addTo(map);  // di akhir selalu di akhiri dengan perintah ini karena objek akan ditambahkan ke map
    }
});
</script>
</div> 
</body>
</html>
</body>
</html>
Save dan coba jalankan di browser dengan mengetik link berikut di link address pada browser :
localhost/webgis/info-geospasial/ atau localhost/webgis/info-geospasial/index.php
Jika tahapan di atas diikuti dengan benar, maka hasilnya akan seperti gambar berikut :
Tampilan WebGIS dengan basemap 1
Tampilan WebGIS dengan basemap 1
Tampilan WebGIS dengan basemap 2
Tampilan WebGIS dengan basemap 2
Demikian tutorial cara Membuat WebGIS dengan Leaflet JavaScript part 1. Di part selanjutnya kita akan me Thematic vektor nya sehingga setiap kabupaten memiliki warna yang berbeda, serta akan ditambahkan beberapa vektor tambahan. Semoga Bermanfaat . . .

Wassalamualaikum Wr.Wb

IMPORT DATA SHP DARI QUANTUM GIS KE POSTGRESQL

Assalamualaikum Wr.Wb


Masih tentang pengenalan komponen serta tutorial dasar sebelum masuk ke artikel utama yaitu Pembuatan WebGIS. Kali ini akan dijelaskan bagaimana cara import data SHP dari software Quantum GIS ke Managemen database PostgreSQL. 
shp-qgis-postgis
Quantum GIS sendiri merupakan software pengolahan data spasial yang dikembangkan oleh Open Source Geospatial Foundation (OSGeo), software ini dapat diperoleh secara bebas. Pembahasan lengkap dari software ini sudah pernah di buat di artikel berikut :
Pertama jalankan program QGIS, lalu jalankan juga program PgAdminIII. Login ke server, pastikan PostgreSQL sudah terinstal plugin PostGIS. Di dalam QGIS coba koneksi ke database di PosgreSQL, caranya dengan menggunakan tool Tambahkan Layer PostGIS tambahkan layer postgis, buat koneksi baru ke database kemudian isi pada bagian jendela yang muncul seperti berikut :
koneksi database di PostgreSQL
Koneksi Database di PostgreSQL
  • Nama  : Nama Koneksi (bebas bisa disesuaikan)
  • Layanan : -
  • Host : localhost
  • Port : isi dengan port yang digunakan di PostgreSQL
  • Basisdata : isi dengan nama database yang akan dikoneksikan
  • Nama Pengguna : isi dengan username yang telah ditentukan pada saat pertama kali melakukan instalasi PostgreSQL (default nya adalah : postgres)
  • Sandi : isi dengan password untuk login ke PostgreSQL
Lakukan tes koneksi terlebih dahulu, jika berhasil klik ok untuk melanjutkan. Di dalam jendela Tambahkan Layer PostGIS, pada menu dropdown pilih Nama Koneksi yang baru saja di buat, kemudian klik Koneksikan.
Tambahkan Layer PostGIS
Tambahkan Layer PostGIS
Jendela di atas hanya berfungsi untuk memanggil Layer yang sudah ada di dalam Database ke dalam Quantum GIS, jadi bukan untuk menambahkan Layer ke dalam Database. Namun tool tersebut digunakan untuk membuat koneksi terlebih dahulu ke database sebelum memulai untuk menambahkan Layer SHP ke dalamnya.
Karena di dalam Database belum ada Layer SHP, maka pada saat dikoneksikan seperti pada gambar di atas, tidak ada Layer yang dapat dipanggil ke tampilan Quantum GIS.
Close jendela diatas, kemudian panggil Layer SHP yang akan ditambahkan ke Database dengan menggunakan tool Tambahkan Layer Vektor . Sebagai contoh di dalam tutorial ini akan digunakan Layer Administrasi Provinsi Bali yang dapat di unduh di link berikut :
Atau bisa gunakan file SHP lain yang dapat di unduh di link artikel berikut :
Administrasi Provinsi Bali
Administrasi Provinsi Bali
Attribut Tabel Layer Bali
Atribut Tabel Layer Bali
Setelah Layer SHP di panggil ke tampilan utama QGIS, selanjutnya masuk ke menu Basisdata > DB Manager > DB Manager, klik Pilihan PostGIS kemudian pilih nama koneksi ke database yang sebelumnya telah di buat yang akan ditambahkan Layer SHP baru ke dalamnya. Klik public pada nama koneksi tersebut lalu klik tool Import Layer/File.
DB Manager
DB Manager 1
Impor Layer
Impor Layer
Pada pilihan masukan pilih Layer yang akan ditambahkan, kemudian klik Opsi Pembaruan, maka opsi di bawahnya akan otomatis terisi. Skema pilih Public, pada opsi meskipun sudah terisi otomatis namun dapat di isi juga secara manual. Jika sudah klik Ok. Maka akan muncul popup pemberitahuan status import.
DB Manager
DB Manager 2
Pada gambar di atas terlihat layer SHP sudah berhasil ditambahkan ke Database. Untuk memastikan bisa di cek juga di database pada PgAdminIII. Masuk ke info-geo > Schemas > Public > Tables.
Tabel Bali di database info-geo di PostgreSQL
Tabel Bali di database info-geo di PostgreSQL
Attribut Tabel Layer Bali di PostgreSQL
Atribut Tabel Layer Bali di PostgreSQL
Pada kedua gambar di atas terlihat bahwa Layer SHP (Bali) sudah berhasil di tambahkan ke database dan dengan isian atribut tabel yang sama dengan Atribut tabel di layer SHP.
Selanjutnya kita coba untuk memanggil Layer di database tersebut ke dalam Quantum GIS dengan menggunakan tool Tambahkan Layer PostGIS.
Tambahkan Layer SHP dari database di PostgreSQL ke QGIS
Tambahkan Layer SHP dari database di PostgreSQL ke QGIS
Terlihat pada gambar di atas, sudah terdapat tabel baru yaitu (Bali) yang dapat di tambahkan ke tampilan layer editing di QGIS.
Layer Bali dari database di PostgreSQL
Layer Bali dari database di PostgreSQL
Demikian artikel cara Import data SHP dari QGIS ke PostgreSQL, untuk lebih jelas tutorial di atas bisa di lihat di video berikut :
Baca juga artikel pandahuluan sebelum kita memulai ke artikel utama yaitu Pembuatan WebGIS, diantaranya :

Wassalamualaikum Wr.Wb

KONEKSI POSTGRESQL KE GEOSERVER

Assalamualaikum Wr.Wb

Artikel ini dibuat sebagai tahap lanjutan pengenalan sebelum masuk ke dalam proses pembuatan WebGIS. Sebelumnya INFO-GEOSPASIAL pernah membahas dan membuat atikel yang saling berkaitan dengan artikel ini, diantaranya :
Ketiga komponen yang disebutkan pada artikel tersebut akan berperan penting dalam proses pembuatan WebGIS yang akan dibahas. Pada artikel ini akan menjelaskan bagaimana cara mengkoneksikan Database pada PostgreSQL ke GeoServer. Dalam asumsi bahwa isi di dalam database adalah objek geometrik berupa file .SHP (shapefile). Proses menginput file .SHP ke Database di PostgreSQL bisa di lihat di artikel Pengertian PostgreSQL.
Mulai proses koneksi dengan menjalankan PgAdmin III pada PostgreSQL, login ke server dengan menggunakan password yang sudah ditentukan sebelumnya. Dalam bahasan ini database yang digunakan adalah Indonesia, input file .SHP ke dalam database tersebut (nama db bisa disesuaikan dan isi file juga bisa di sesuaikan dengan data yang dimiliki). 
Proses input file .SHP harus menggunakan plugin PostGIS. Jalankan plugin PostGIS di dalam database Indonesia, kemudian lakukan koneksi ke database tersebut dengan isian sebagai berikut :
Koneksi PostGIS ke database Indonesia
Koneksi PostGIS ke database Indonesia
  • Username : postgres
  • Password : (isi dengan password yang sama pada saat masuk ke server di PostgreSQL)
  • Server Host : localhost
  • Port : Isi dengan port yang digunakan (yang telah ditentukan pada saat instalasi PostgreSQL), secara default portnya adalah : 5432, namun dalam contoh ini port yang digunakan adalah 3610.
  • Database : isi dengan nama database yang akan dikoneksikan
Jika berhasil maka akan muncul pemberitahuna di bagian log windows. Selanjutnya pada bagian Import panggil file .SHP, dalam contoh ini digunakan indo_provinces (sebagai bahan latihan bisa unduh data SHP di artikel berikut : Data SHP Seluruh Indonesia).
Pada file SHP yang telah panggil, bagian SRID isi dengan : 4326 (dimaksudkan untuk memeberitahui sistem bahwa data tersebut menggunakan sistem projeksi geografis longitude/latitude dengan datum WGS 84). Jika file shp berisikan objek yang terpisah untuk setiap objeknya, misal provinsi bali terdiri dari pulau bali dan beberapa pulau kecil lainnya (tidak bergabung/tidak digabung menjadi satu objek tunggal) maka itu dapat dilakukan setingan pada bagian Option dengan menselect Generate simple geometries instead of MULTI geometries.
Maksudnya agar file tersebut dirubah kedalam bentuk Single Geometric, sehingga ketika database tersebut dikoneksikan ke aplikasi GIS (QGIS, ArcGIS, dll), file tersebut dapat dilakukan editing seperti menambah objek baru.
Jika objek pada file SHP tersebut berisikan objek terpisah namun sudah dalam bentuk Multi Geometric (sudah di combine/merge) maka tidak dapat dirubah ke dalam bentuk Single Geometric, namun file tersebut masih bisa diedit di dalam aplikasi GIS (jika proses editing dilakukan dengan mengkoneksikan database ke aplikasi GIS) hanya saja tidak bisa menambahkan objek baru, hanya bisa mengedit node dan vertex dari objek di dalamnya.
Jadi untuk mengatasi hal tersebut, sebelum dimasukan ke database, lakukan edit ulang pada file SHP dengan menggunakan aplikasi GIS, dan pastikan tidak ada objek yang digabungkan untuk setiap objek yang terpisah. Di aplikasi ArcGIS bisa menggunakan fungsi Multipart to Singlepart, atau di  aplikasi MapInfo bisa menggunakan Disaggregate.
Select Single Part
Mengatur file ke dalam bentuk Single geometric
Untuk file yang sudah Multi Geometric, maka ketika di import akan gagal seperti gambar berikut :
Gagal Import
File berbentuk Multi Geometric gagal di Import
Dan untuk file yang berada dalam bentuk single geometric, ketika di import maka akan berhasil, seperti gambar berikut :
File berbentuk geometrik sederhana berhasil di import
File berbentuk Single Geometric berhasil di import
Setelah proses import SHP ke database berhasil dilakukan, tabel SHP tersebut dapat dilihat di pilihan database Indonesia > Schemas > Public > Tables, kemudain pilih nama tabel dari SHP tersebut, gunakan tools table yang ada pada toolbox.
tabel SHP Indo_Provinces
Tabel SHP Indo_Provinces di PostgreSQL
berikutnya adalah koneksi database tersebut ke GeoServer. Jalankan program GeoServer, Login dengan username dan password yang sudah ditentukan. Kemudian buat Workspace baru dengan nama Indonesia.
Buat Workspace Indonesia
Buat Workspace Indonesia
Kemudian masuk ke menu Stores, tambahkan store baru, pilih PostGIS kemudian berikan setingan sebagai berikut :
setting koneksi ke database
Setting Koneksi ke database Indonesia di PostgreSQL dengan bantuan PostGIS
  • Workspace : Indonesia
  • Data Source Name : (isi sesuai dengan nama yang di inginkan)
  • Description : (Isi dengan deskripsi yang di inginkan)
  • Dbtype : postgis
  • Host : localhost
  • Port : (isi dengan port yang digunakan pada PostgreSQL)
  • Database : nama database yang akan di koneksikan
  • Schame : Public
  • User : postgres
  • Password : (isi dengan password untuk masuk ke server PostgreSQL)
Atur setingan diatas sesuai dengan database yang akan di koneksikan, jika berhasil maka akan muncul daftar layer yang berada pada database yang berhasil di koneksikan.
daftar layer yang berada pada database
Daftar layer yang berada pada database
Dari daftar layer yang muncul (layer indo_provinces), klik publish. Kemudian atur settingan sebagai berikut :
SETTING LAYER INDO PROVINSI
Setting Layer Indo_Provinces
  • Name : (isi dengan nama dari layer tersebut)
  • Title : (judul layer)
  • Abstract :  (deskripsi dari layer)
  • Native SRS dan Declare SRS : otomatis terisi dengan EPSG:4326, karna sebelumnya sudah di atur pada saat import SHP ke database dengan mengisi kode EPSG tersebut di bagian SRID (bisa diatur sendiri bila sistem projeksi yang digunakan berbeda)
  • Bounding Boxes : klik link Compute from data dan Compute from native bounds untuk menampilkan batas koordianat dari layer tersebut.
  • Feature Type Details : periksa kembali nama kolom dan type dari tabel layer tersebut, jika sudah melakukan perubahan pada isi kolom/kolom klik reload feature type untuk merefresh daftar tabel.
Selanjutnya mencoba menampilkan data SHP tersebut, caranya pada menu Layer Preview cari layer Indo_Provinces,
Layer Indo_Provinces
Layer Indo_Provinces
Tampilkan ke dalam OpenLayer, maka hasilnya akan seperti berikut :
Layer Indo_Provinces di dalam tampilan OpenLayer
Layer Indo_Provinces di dalam tampilan OpenLayer
Selanjunya coba tampilkan ke dalam format GeoJSON, karna format data ini yang nanti akan di panggil ke dalam halaman WebGIS untuk proses pembuatan WebGIS yang akan dibahan pada artikel yang akan datang.
Layer Indo_Provinces di dalam tampilan GeoJSON
Layer Indo_Provinces di dalam tampilan GeoJSON
Sekian artikel tetang cara koneksi database di PostgreSQL ke GeoServer. Tutorial selanjutnya akan langsung membahas proses pembuatan WebGIS dengan menggunakan komponen-komponen yang sudah dijelaskan pada beberapan artikel sebelumnya.
Semoga Bermanfaat  . . .

Wassalamualaikum Wr.Wb

VISUALISASI 3D GOOGLE IMAGERY DENGAN EFEK EXTRUDE DI ARCSCANE

Assalamualaikum Wr.Wb

Pada kesempatan ini, blog INFO-GEOSPASIAL akan membagikan tutorial cara membuat peta 3D dengan efek Extrude di ArcScane, tutorial ini merupakan kelanjutan dari tutorial ArcScane yang sudah pernah di bahas sebelumnya :
Sebelum memulai tahap pembuatan peta 3D, diperlukan bahan-bahan sebagai berikut :
  1. Image google satelit dari daerah yang akan dibuat petanya (harus sudah tergeoreferencing), cara melakukan georeferencing image dari google satelite bisa di lihat di artikel GEOREFERENCING GOOGLE IMAGERY IN ARCGIS
  2. Data kontur dari daerah yang dimaksud (bisa buat sendiri dari data DEM)
  3. Shapefile polygon dari daerah yang di maksud, digunakan sebagai lantai atau dasar dari peta
Mulai tahapan pembuatan peta dengan menjalankan aplikasi ArcScane, panggil ketiga data di atas (semua data di atas harus menggunakan sistem koordinat meter (UTM), jika sudah terlanjur menggunakan sistem koordinat geografis, maka di dalam menu properties pada Scane Layer di dalam TOC, atur sistem koordinatnya menggunakan WGS 1984 World Mercator)
Layer Bandung, Contour, dan Area
Layer Bandung, Contour, dan Area
Dalam bahasan ini, layer image google satelit di beri nama ‘Bandung’, layer kontur di beri nama ‘Contour’, dan layer objek polygon diberi nama ‘area’. Pertama unselect layer bandung dan area, biarkan hanya layer contour saja yang ditampilkan. Aktifkan extension 3D Analyst dengan cara masuk ke menu Customize > Extensions > select pada bagian 3D Analyst. Panggil toolnya ke dalam toolbar dengan cara masuk ke menu Customize > Toolbars > 3D Analyst.
Extension 3D Analyst
Extension 3D Analyst
Layer kontur yang saat ini di tampilkan masih dalam bentuk 2D, maka buat terlebih dahulu kontur 3D dari kontur tersebut, caranya di dalam toolbar 3D Analyst masuk ke menu Feature to 3D (jika tidak tersedia tools tersebut, maka lakukan tahapan berikut : masuk ke menu Customize > Customize Mode > Pada tab Command pilih categories 3D Analyst dan pada bagian commands pilih tool yang akan ditambahkan dengan cara pilih tool yang di maksud kemudian tarik/drag ke dalam toolbar 3D Analyst).
Menambahkan Tool
Menambahkan Tool
Di dalam menu Feature to 3D, input feature isi dengan layer Contour, kemudian Source of Height pilih berdasarkan field attribute dari layer contour tersebut.
Feature to 3D
Feature to 3D
Hasil dari tahap di atas akan terbentuk layer baru yang berisikan objek kontur dalam bentuk 3D, seperti berikut :
Contour 3D
Contour 3D
Selanjutnya buat raster TIN dari layer Contur_3D, caranya masuk ke menu Create TIN From Faature di dalam toolbar 3D Analyst (Jika tidak ada, tambahkan tool tersebut dengan cara yang sama seperti tahapan sebelumnya). Gunakan layer Contour_3D untuk mengisi Height Source dengan Feature Z Value, pada bagian Triangulate as pilih Hard Line, kemudian gunakan layer Area untuk membuat Soft Clip pada bagian Triangulate as, lebih jelasnya perhatikan gambar berikut :
Create TIN from Feature
Create TIN from Feature
Hasilnya akan terbentuk Raster TIN seperti berikut :
Raster TIN
Raster TIN
Berikutnya aktifkan layer Area, kemudian konversi objek area tersebut yang masih berupa objek polygon ke dalam objek line, caranya masuk ke Arctoolbox > Data Management Tools > Features > Feature to Line. Sehingga akan terbentuk layer baru yang berisikan objek line. Dalam tutorial ini layer tersebut di beri nama ‘Extrude’, dalam menu properties dari layer tersebut atur Base Height dengan Elevation from surface mengacu pada Raster TIN. Kemudian di dalam tab Extrusion select pada bagian Extrude Features in Layer dan pilih Using it as a value that features are extruded to pada menu Apply Extrusion. Hasil dari proses tersebut akan membuat line terextrusion berdasarkan ketinggian dari Raster TIN.
Raster TIN dengan Extrude objek lantai
Raster TIN dengan Extrude objek lantai
Dan tahap terakhir, aktifkan layer Bandung kemudian atur Base Height dengan mengacu pada Raster TIN, unselect Raster TIN agar hilang dari tampilan layar, dan hasilnya kurang lebih akan seperti berikut :
Image Satelite dengan extrude objek lantai
Image Google Satelit dengan Extrude objek lantai
Untuk lebih mempercantik tampilan, gunakan image satelite yang lebih jelas serta lebih terlihat perbedaan tinggi dan rendah permukaannya, tambahkan pula objek sungai agar tampilan terlihat lebih nyata. Semoga bermanfaat . . .

Wassalamualikum Wr.Wb

JELAJAHI TATA SURYA DENGAN NASA EYES

Assalamualaikum Wr.Wb

NASA (National Aeronautics and Space Administration)  adalah lembaga pemerintah milik Amerika Serikat yang bertanggung jawab atas program luar angkasa Amerika Serikat dan penelitian umum luar angkasa jangka panjang. Organisasi ini bertanggung jawab atas program penelitian luar angkasa bagi masyarakat sipil, aeronautika, dan program kedirgantaraan.
Nasa Eyes Visualization
Nasa Eyes Visualization
Dan untuk mempermudah publik dalam mengakses informasi yang mereka sampaikan, maka mereka membuat NASA's Eyes aplikasi penjelajah tata surya berbasis web yang dikembangkan oleh NASA Jet Propulsion Laboratory, California Institute of Technology sebuah lembaga penelitian yang di danai pemerintah federal dan NASA. Terdapat 3 jenis visual yang ditampilkan yaitu :
  • Eyes on the Earth : Memvisualisasikan keadaan serta tanda-tanda vital yang berlangsung di bumi seperti tinggi permukaan laut, konsentrasi karbon dioksida di atmosfer dan ozon Antartika. Melacak gerakan air di seluruh dunia menggunakan peta gravitasi dari satelit GRACE milik NASA. Spot letusan gunung berapi dan kebakaran hutan menggunakan karbon monoksida. Memeriksa lokasi terpanas dan terdingin di Bumi dengan map.It, suhu permukaan global juga menampilkan lokasi semua operasi misi Earth-observing NASA secara real time. Aplikasi ini juga tersedia untuk versi mobile Android dan IOS.
Eyes of the Earth
Eyes of the Earth
  • Eyes on the Solar System : Menampilkan interface yang memadukan teknologi video game dan data-data yang dimiliki NASA. Melalui aplikasi ini kita disuguhi berbagai benda angkasa dalam sistem tata surya seperti matahari, planet, satelit, komet, bintang dan asteroid, lebih dari itu kita dapat berpetualang ke berbagai wilayah di ruang angkasa dengan mengikuti misi ruang angkasa yang dilakukan NASA secara real time.
Eyes on the Solar System
Eyes on the Solar System
  • Eyes on Exoplanets : Memungkinkan pengguna untuk memperbesar lebih dari 1000 planet eksotis untuk lebih dekat. Selain menawarkan tampilan virtual ruang di luar tata surya, kita juga dapat membandingkan orbit planet lain dengan yang ada di tata surya kita, menunjukkan planet yang mungkin mendukung kehidupan, dan memberitahu Anda berapa lama waktu yang dibutuhkan untuk perjalanan ke setiap sistem planet dengan mobil, pesawat, kereta peluru, atau pesawat ruang angkasa.
Eyes on Exoplanets
Eyes on Exoplanets
NASA selalu melakukan update program setiap hari dengan penemuan-penemuan baru dari misi Kepler dan observatorium berbasis darat, sehingga Anda akan selalu mendapatkan gambaran up-to-date dari alam semesta seperti yang kita kenal. Aplikasi ini dapat dijalankan di Operating System Windows dan OS X. Untuk mengunduhnya dapat langsung mengunjungi link berikut :
Lihat highlight nya di video berikut :

Wassalamualaikum Wr.Wb