Membuat Aplikasi Web GIS dengan PHP dan Google Maps


Latar Belakang

Sebelumnya saya pernah belajar tentang GIS dengan menggunakan mapserver. untuk alternatif lain, saya membuat aplikasi GIS sederhana dengan menggunakan Google Map.

Aplikasi yang dibuat adalah GIS untuk menampilkan informasi bencana alam yang terjadi di indonesia. sehingga user bisa menginput koordinat, nama bencana, jumlah korban, dan tanggal kejadian bencana.

Informasinya ditampilkan dalam 2 cara yaitu dalam bentuk peta digital dan dalam bentuk grafik diagram pie, sehingga di ketahui prosentase bencana yang banyak terjadi di indonesia.

Database :

Download

Inti Program

Dalam aplikasi GIS dengan google map dibutuhkan 3 file yaitu :

  1. ambildata.php
  2. simpanlokasi.php
  3. peta.php

Aplikasi ini adalah prototipe yang saya buat, silahkan teman-teman mengembangkannya sesuai kebutuhan atau untuk bahan pembelajaran.

Referensi Buku :

Sistem-informasi-geografis-konsep-konsep-dasar-perspektif-geodesi-dan-geomatika

Sekian artikel dari saya semoga bermanfaat untuk teman-teman dan anda semua…aamiin

Cibubur, 3-08-2012

GusnaNuri

Mengganti port webserver pada XAMPP dan MS4W


Pertanyaan

Ada teman saya yang bernama mas arif dari surabaya bertanya :

asalamualaikum…
sy udah baca beberapa tutorial mas mengenai GIS.
oiya mas mau tanya misalnya di lepi kita installi 2 webserver bisa gk misal mapserver dan myadmin misal xampp?
thank before

Jawaban

Wa’alaikum salam mas arif
yang membedakan adalah port webserver nya. port default untuk webserver adalah 80 misalnya http://localhost:80/ atau cukup dituliskan http://localhost/

Jadi, XAMPP nya aja yang kita ganti port webserver biar tidak bentrok dengan webserver yang lain.

Caranya :

  1. Buka atau edit dengan notepad file httpd.conf yang ada di alamat folder C:\xampp\apache\conf
  2. Setelah dibuka, cari tulisan Listen 80
  3. Kita bisa mengganti dengan port yang lain misalnya 81, sehingga nanti cara memanggil web atau aplikasi yang ada di bawah naungan XAMPP cara manggilnya dengan mencantumkan nama portnya. misalnya http://localhost:81/phpmyadmin
  4. Setelah disetting, jangan lupa di restart XAMPP nya.
  5. Untuk menjalankan mapserver, cukup dengan memanggil http://localhost/peta_gis
  6. Jika kita ingin mengganti port mapserver yang ada di MS4W, dengan cara yang sama buka file httppd.conf yang ada di alamat C:\ms4w\Apache\conf
  7. Lakukan langkah ke-2 sampai langkah ke-4 misalnya mengganti dengan port 82
  8. Maka saat memanggil aplikasi peta digital yang ada di MS4W,  memanggilnya dengan menggunakan alamathttp://localhost:82/peta_gis
  9. Selesai

Referensi Buku :

Sistem-informasi-geografis-konsep-konsep-dasar-perspektif-geodesi-dan-geomatika

Sekian artikel dari saya semoga bermanfaat untuk teman-teman dan anda semua…aamiin

Depok, 05 Maret 2012

noname

Menampilkan peta digital dari Postgis ke Mapserver


Latar Belakang

Dalam tulisan saya terdahulu menjelaskan cara import peta digital dari QuantumGIS ke  database Postgre. sekarang menjelaskan bagaimana caranya menampilkan peta digital yang tersimpan dalam database postgre tersebut dengan bantuan library postgis.

Dalam konsep GIS web base yang saya tau, peta digital itu dapat disimpan dalam file SHP dapat juga disimpan dalam sebuah database. dalam project saya waktu penulisan ilmiah, saya menggunakan teknik pertama yaitu menyimpan peta digital kedalam kumpulan file-file SHP. untuk pengembangannya sekarang saya mempelajari teknik menyimpan peta digital kedalam sebuah database postgre menggunakan library postgis.

Tahap Persiapan

yang harus disiapkan dalam percobaan ini adalah file peta_db.map yang berisi script mapserver yang digunakan untuk melakukan koneksi ke database postgre. dan menjalankan query untuk menampilkan peta digital yang ada didalam tabel distrik yang sebelumnya sudah terbuat dan sudah berisi data.

Tahap Coding

kita membuat sebuah file peta_db.map yang sisimpan dalam folder C:\ms4w\apps\map\

#
# Komentar untuk mapfile ybs.
#
MAP                      # tanda awal mapfile
NAME        District  #
IMAGETYPE   JPEG        # bisa PNG, GIF, dll
EXTENT      -119.88000 36.53000 -119.33000 36.89000  # B1,L1; B2,L2
STATUS      ON     #
UNITS       DD    # satuan derajat
SIZE        350 400   # ukuran image
SHAPEPATH   “\ms4w\apps\map\shp”
IMAGECOLOR  255 255 255
#
# Mulai pendefinisian layers
#
LAYER
NAME      District
STATUS    ON
TYPE      POLYGON

CONNECTIONTYPE POSTGIS
CONNECTION “host=localhost dbname=testgis user=postgres password=shugaru7 port=5432
DATA “the_geom from distrik

CLASS
NAME   “District”
STYLE
COLOR 179 243 251
OUTLINECOLOR 0 0 0
END # style
END # class
END # Akhir definisi layer
#
END # Akhir mapfile

Membuat Halaman Web

kita membuat sebuah file index_db.html yang sisimpan dalam folder C:\ms4w\Apache\htdocs\web\

<html>
<head><title>Menampilkan Peta dari Postgis-Mapserver</title></head>
<body>
<center>
<img border=”1″ src=”http://localhost/cgi-bin/mapserv.exe?map=/ms4w/apps/map/peta_db.map&layer=District&mode=map“>
</center>
</body>
</html>

Tahap Testing

Untuk menjalankannya kita menggunakan sebuah web browser dan mengetikan alamat url :

  1. http://localhost/web/index_db.html
  2. Anda juga dapat menggunakan alamat URL langsung menuju file mapservernya http://localhost/cgi-bin/mapserv.exe?map=/ms4w/apps/map/peta_db.map&layer=District&mode=mapsehingga hasilnya akan tampil seperti dibawah ini :

    Output

Referensi Buku :

Sistem-informasi-geografis-konsep-konsep-dasar-perspektif-geodesi-dan-geomatika

Sekian artikel dari saya semoga bermanfaat untuk teman-teman dan anda semua…aamiin

Depok, 13-06-2011

noname

Import peta digital dari Quantum GIS ke Postgis


Pendahuluan

Artikel ini membahas tentang bagaimana cara mengkonversi file SHP menjadi file SQL dan memasukannya kedalam database postgree dengan bantuan library postgis. ada 2 cara yang bisa di gunakan yaitu :

  • Menggunakan command prompt (cmd)
  • Menggunakan plugins Quantum GIS

Tahap Persiapan

yang harus disiapkan dalam belajar GIS berbasis web adalah :

  1. Mapserver menggunakan software ms4w (saya menggunakan versi 1.6)
  2. QuantumGIS untuk membuat peta digital (saya menggunakan versi 0.9.1 Ganymede)
  3. Database PostgreSQL dan postgis (saya menggunakan Postgre versi 8.1 yang include postgis)
  4. Siapkan file SHP yang sebelumnya sudah dibuat (bisa anda download di sini)

Cara Pertama  (Menggunakan Command prompt)

  1. Saya asumsikan semua software pada tahap persiapan sudah selesai di install. dan peta digital sudah di simpan di C:\ms4w\apps\map\shp
  2. Setelah itu buka command promtnya dan ketik syntax berikut ini untuk menyeting path postgre agar bisa di jalankan di semua alamat folder :  set PATH=%PATH%;C:\Program Files\PostgreSQL\8.1\bin
  3. Setelah itu menuju folder tempat file SHP berada  C:\ms4w\apps\map\shp
  4. Kemudian ketik syntak berikut untuk mengkonversi SHP ke SQL :
    shp2pgsql fdistrict.shp distrik > distrik.sql
  5. Setelah itu ketik syntax berikut untuk import SQL ke Postgre. TAPI sebelumnya harus dibuat dahulu di pgAdminIII (Postgre Admin) sebuah database bernama gisdb dengan user defaultnya postgres : psql -U postgres -d gisdb -f distrik.sql -W
  6. Setelah dimasukan password untuk user postgres, jika berhasil maka di cek di portgres database gistdb terdapat tabel distrik.

Untuk lebih jelasnya bisa dilihat hasil capture berikut ini :

Capture Syntax Command Prompt

Cara Kedua (Menggunakan Plugin SPIT)

cara kedua ini menggunakan plugins yang sudah disediakan oleh QuantumGIS. caranya adalah :

  1. Jalankan software quantumGIS
  2. Aktifkan plugins melalui menu Plugins>Plugins Manager>Cari dan centang plugins SPIT>klik OK
  3. Setelah berhasil pilih kembali menu Plugins>Spit>Import shape file to postgreSQL
  4. Setelah itu buat koneksi baru dengan klik tombol new. contoh settingnya lihat gambar dibawah ini :
  5. Setelah itu dibagian shapefile list Klik tombol add dan cari file SHP di alamat C:\ms4w\apps\map\shp\fdistrict.shp
  6. Setelah itu klik OK. maka file SHP pun akan di import langsung ke database postgreSQL
  7. Bisa dilihat hasilnya di database postgre
  8. Selesai

Referensi Buku :

Sistem-informasi-geografis-konsep-konsep-dasar-perspektif-geodesi-dan-geomatika

Penutup

Jadi sekarang peta digital anda tidak di simpan lagi dalam file SHP, tapi langsung disimpan dalam database postgre dengan bantuan library postgis. sekian artikel dari saya semoga bermanfaat untuk teman-teman dan anda semua…aamiin

Depok, 12-6-2011

noname

Membuat situs webGIS menggunakan mapserver dan phpmapscript


Pada artikel kali ini saya menjalaskan tentang aplikasi GIS (geografic information system) berbasis web yang menggunakan teknologi mapserver. untuk interfacenya menggunakann bahasa dan fungsi php/mapscript. sedangkan databasenya menggunakan mysql.

Download 

Cara Konfigurasi

  1. Download MS4W
  2. Simpan database di mysql (anda bisa kolaborasi dengan xampp untuk memanfaatkan mysql dan phpmyadminnya)
  3. Simpan folder peta pada C:\ms4w\apps\
  4. Simpan folder web pada C:\ms4w\Apache\htdocs\
  5. Panggil web dengan buka browser dan ketik http://localhost/folder_web/
  6. Selesai

Perhatian :

Untuk databasenya saya menggunakan MySQL  untuk menyimpan content web dan untuk peta digitalnya saya gunakan hanya untuk menyimpan alamat file *.map . berhubung ms4w tidak terdapat database mysql, maka kita menginstall mysql nya terlelbih dahulu. saya sarankan menggunakan xampp 1.6.* yang cocok dengan ms4w karena masih menggunakan PHP4. adapun caranya adalah sebagai berikut :

  1. Download dan install software xampp 1.6.2
  2. Setelah berhasil, jalankan xampp control panel aplication
  3. Klik hanya tombol start MySQL
  4. Buka window explorer dan copy folder phpmyadmin yang ada dialamat  C:\xampp\phpMyAdmin\
  5. Paste ke folder htdocs yang ada di alamat C:\ms4w\Apache\htdocs\
  6. Jalankan software ms4w dengan klik apache-install.bat di alamat folder C:\ms4w
  7. Buka browser dan ketik http://localhot/phpmyadmin
  8. Setelah itu buat database dengan nama endemikdb setelah itu import database yang sudah teman2 download
  9. Untuk cara importnya silahkan baca artikel cara import-export database mysql
  10. Selesai

Referensi Buku :

Sistem-informasi-geografis-konsep-konsep-dasar-perspektif-geodesi-dan-geomatika

Sekian artikel dari saya semoga bermanfaat dan silahkan dikembangkan untuk tujuan edukasi. terima kasih

Depok, 09-04-2011

noname

Membuat Peta Digital dengan Quantum GIS


Pada artikel kali ini saya akan membahas tentang cara pembuatan peta digital menggunakan Quantum GIS.  namun tutorial lengkapnya saya pisahkan kedalam file PDF yang bisa anda download pada URL dibawah.

Dalam artikel yang saya buat ada cara pembuatan gambar menggunakan poligon, dan point. gambar poligon biasanya digunakan untuk membuat sebuah gambar wilayah dalam peta digital. sedangkan gambar point (titik) biasa digunakan untuk untuk menggambar isi yang ada didalam gambar poligon. misalnya untuk menggambarkan sebuah objek seperti kampus, kos-kosan, tempat terjadinya suatu kejadia/kecelakaan, dll.

Yang harus diperhatikan :

  1. Dibutuhkan file gambar sebagai “kanvas” yang nantinya akan di gambar ulang menggunakan quantum GIS.
  2. Download software quantum GIS. saya sarankan Quantum GIS 0.9.1
  3. Jangan lupa untuk menyimpan data setiap selesai memasukan data kedalam gambar dengan “menutup” icon “Toogle Editing”.
  4. Selebihnya tinggal masalah pembuatan file *.map untuk menampilkan peta yang sudah jadi tadi kedalam sebuah web dengan bantuan syntax mapscript.

Mungkin anda bingung, tapi mudah-mudahan dengan membaca artikel nanti. ada tambahan ilmu untuk anda.

Download

Referensi Buku :

Sistem-informasi-geografis-konsep-konsep-dasar-perspektif-geodesi-dan-geomatika

Sekian tutorial dari saya, semoga bermanfaat untuk Anda semua.

Depok, 14-07-2010

noname

Menampilkan Peta sederhana mapserver di HTM


Sebelumnya saya asumsikan bahwa anda menggunakan “MS4W” dalam menjalankan aplikasi web peta digital dengan mapserver. Dan silahkan download contoh source mapserver.

Download source :

http://www.4shared.com/file/191256077/bc0d60f/source-gis.html

Download MS4W :

http://www.4shared.com/file/240217017/1459928c/ms4w_16.html

File-file yang kita butuhkan adalah :

  1. File index.html simpan di folder C:\ms4w\Apache\htdocs\web. Untuk memanggil gambar peta melalui halaman html.
  2. File peta.map simpan di folder C:\ms4w\apps\map. Untuk menyusun layer-layer peta (file *.shp).
  3. File fdistrict.dbf,  fdistrict.sbn,  fdistrict.sbx,  fdistrict.shp,  fdistrict.shx simpan di folder C:\ms4w\apps\map\shp. Sebagai gambar digitalnya yang dibuat dengan aplikasi QuantumGIS.

Script di file index.html :

Hanya untuk menampilkan gambar peta dengan mengirim link ke /cgi-bin/mapserv.exe?

<html>

<head><title>Menampilkan peta di halaman HTML — ri32.wordpress.com</title></head>

<body>

<img border=”1″ src=”http://localhost/cgi-bin/mapserv.exe?map=c:/ms4w/apps/map/peta.map&layer=District&mode=map&#8221;>

</body>

</html>

Script di file peta.map :

#

# Komentar untuk mapfile ybs.

#

MAP        # tanda awal mapfile

NAME        District  #

IMAGETYPE   JPEG              # bisa PNG, GIF, dll

EXTENT      -119.88000 36.53000 -119.33000 36.89000  # B1,L1; B2,L2

STATUS      ON          #

UNITS       DD           # satuan derajat

SIZE        350 400   # ukuran image

SHAPEPATH   “c:\ms4w\apps\map\shp”

IMAGECOLOR  255 255 255

#

# Mulai pendefinisian layers

#

LAYER

NAME      District

DATA      fdistrict

STATUS    ON

TYPE      POLYGON

CLASS

NAME   “District”

STYLE

COLOR 179 243 251

OUTLINECOLOR 0 0 0

END # style

END # class

END # Akhir definisi layer

#

END # Akhir mapfile

File-file SHP :

File-file *.shp merupakan gambar digitalnya, gambarnya tersebut di hasilkan dengan bantuan aplikasi quantumGIS. Jadi gambar yang di tampilkan bukan gambar langsung dengan format *.jpg atau *.gif.

Adapun struktur folder pada aplikasi ms4w adalah seperti di bawah. Folder “web” berisi file-file web baik di buat dengan PHP atau HTML. Sedangkan folder “map” berisi file-file *.map yang berfungsi untuk mengatur tampilan peta digital, dan file-file di folder shp untuk gambar digitalnya.

Continue reading

Sistem Informasi Geografis


Artikel ini bukan berisi cara pembuatan web GIS, tapi memberikan contoh web GIS yang pernah saya buat dengan menggunakan mapserver. Artikel tentang GIS, Mapserver, dan PHP/mapscript dapat anda cari sendiri.

FILE DOWNLOAD :

http://www.4shared.com/file/125107508/8d183d4c/agis.html

File-file yang dibutuhkan adalah sebagai berikut :

  1. File koneksi untuk koneksi ke database (conn.php).
  2. File halaman utama web GIS (agis.php).
  3. File untuk memproses(peta-proses.php)
  4. File untuk membuat session variable map dan tahun (session.php)
  5. File untuk menampilkan peta digital (peta.php).
  6. File untuk mengolah peta digital yang akan di tampilkan(mapscript.php).

Struktur Navigasinya adalah sebagai berikut :

struktus-nav

Referensi Buku :

Sistem-informasi-geografis-konsep-konsep-dasar-perspektif-geodesi-dan-geomatika

noname

depok, 14-08-09

Follow

Get every new post delivered to your Inbox.

Join 480 other followers

%d bloggers like this: