Peta Interaktif

Tutorial Pembuatan Peta Interaktif

Membuat file MAP (konfigurasi layer-layer) bag. ketiga

with 14 comments

Pada artikel sebelumnya, telah dibuat beberapa kode di file MAP, dalam artikel ini saya akan membahas konfigurasi layer-layer peta yang kita miliki di file MAP.

Kita akan membuat pada peta di Chameleon dengan menggunakan 3 layer:
1. Layer “Sungai”
2. Layer “Poli Bantu”
3. Layer “Administrasi”

Saya akan membahasnya satu persatu.

LAYER “SUNGAI”

#
# Start of layer definitions
#

LAYER
  GROUP "Polygon"
  NAME sungai
  METADATA
    "DESCRIPTION" "Sungai"
    "GROUP" "Polygon"
    "LAYER" "sungai"
  END
  TYPE POLYGON
  STATUS ON
  DATA sungai
  CLASS
    NAME "Sungai"
    COLOR 23 149 247
    OUTLINECOLOR 23 149 247
  END
PROJECTION
    "init=epsg:4269"
END
END # layer

GROUP, digunakan untuk pengklasifikasian grup, untuk layer “sungai” kita masukkan ke grup polygon.
NAME, layer “sungai” diberi nama variabel “sungai”.
METADATA, kode ini digunakan untuk menghubungkan ke file DBF yang dimiliki oleh layer.
TYPE, tipe layer terdiri dari 3 jenis, yaitu tipe “Polygon”, “Line” dan “Point”.
STATUS, nilai variabel STATUS adalah ON menandakan bahwa layer “sungai” akan muncul sewaktu pertama kali halaman web ditampilkan. jika kamu tidak ingin memunculkan layer “sungai” pada saat awal tampilan, dapat diganti nilainya menjadi OFF
DATA, variabel ini diisikan dengan nilai “sungai” yang merujuk ke file “sungai.dbf”, harap diingat bahwa penamaan file tidak boleh memiliki karakter spasi, misalkan “sungai besar”, dapat diganti dengan “sungai_besar”.
COLOR, warna sungai, dengan kode RGB.
OUTLINECOLOR, warna garis tepi, dengan kode RGB.
PROJECTION, atau proyeksi disamakan nilainya dengan variabel PROJECTION di atas

Nilai Pada CLASS=>NAME sama dengan METADATA=>DESCRIPTION

LAYER POLI_BANTU

LAYER
  GROUP "Polygon"
  NAME poli_bantu
  METADATA
    "DESCRIPTION" "Poli_Bantu"
    "RESULT_FIELDS" "NAMA"
    "GROUP" "Polygon"
    "LAYER" "poli_bantu"
  END
  TYPE POLYGON
  STATUS ON
  DATA poli_bantu
  LabelItem "NAMA"
  CLASSITEM "ID"
  CLASS
  	EXPRESSION "1"
    NAME "Poli_Bantu"
    COLOR 23 149 247
	OUTLINECOLOR 0 0 0
	LABEL
      COLOR 255 255 255
      FONT fritqat-italic
      TYPE truetype
	  SIZE 7
      POSITION AUTO
	  PARTIALS FALSE
    END
  END
  TOLERANCE 0
  TOLERANCEUNITS PIXELS
PROJECTION
    "init=epsg:4269"
END
END # layer

Pada layer Poli_bantu, di CLASS terdapat EXPRESSION yang memiliki nilai “1″, nilali tersebut adalah data (poli_bantu.dbf) yang dimiliki oleh layer poli_bantu, tepatnya yang berada di kolom poli_bantu.dbf “NAMA” ( METADATA=>RESULT_FIELDS).

Setelah baris kode EXPRESSION “1″, terdapat konfigurasi warna, jenis huruf, ukuran, dan posisi tulisan jika data (poli_bantu.dbf) pada kolom “NAMA” memiliki nilai “1″.

Jika kamu memiliki data pada kolom “NAMA” sama dengan “2″, kamu dapat memperlakukan beda dari warna, ukuran, dan juga jenis huruf, sebagai pembeda dengan data yang bernilai “1″.

LAYER ADMINISTRASI

LAYER
  GROUP "Polygon"
  NAME adm
  METADATA
    "DESCRIPTION" "Administrasi"
	"RESULT_FIELDS" "KECAMATAN"
    "GROUP" "Polygon"
    "LAYER" "adm"
  END
  TYPE POLYGON
  STATUS ON
  DATA adm
  LabelItem "KECAMATAN"
  CLASSITEM "ID"
  CLASS
  	TEMPLATE "ttt_query.html"
  	EXPRESSION "1"
    NAME "Administrasi"
    COLOR 255 204 0
	OUTLINECOLOR 0 0 0

	LABEL
      COLOR  0 0 0
	  OUTLINECOLOR 255 255 255
      FONT fritqat-italic
      TYPE truetype
	  SIZE 7
      POSITION AUTO
	  PARTIALS FALSE
    END
  END

  CLASS
  	TEMPLATE "ttt_query.html"
  	EXPRESSION "2"
    NAME "Administrasi"
    COLOR 255 255 102
    OUTLINECOLOR 0 0 0

	LABEL
      COLOR  0 0 0
	  OUTLINECOLOR 255 255 255
      FONT fritqat-italic
      TYPE truetype
	  SIZE 7
      POSITION AUTO
	  PARTIALS FALSE
    END
  END

  CLASS
  	TEMPLATE "ttt_query.html"
  	EXPRESSION "3"
    NAME "Administrasi"
    COLOR 255 153 51
    OUTLINECOLOR 0 0 0

	LABEL
      COLOR  0 0 0
	  OUTLINECOLOR 255 255 255
      FONT fritqat-italic
      TYPE truetype
	  SIZE 7
      POSITION AUTO
	  PARTIALS FALSE
    END
  END

  CLASS
  	TEMPLATE "ttt_query.html"
  	EXPRESSION "4"
    NAME "Administrasi"
    COLOR 221 188 119
    OUTLINECOLOR 0 0 0

	LABEL
      COLOR  0 0 0
	  OUTLINECOLOR 255 255 255
      FONT fritqat-italic
      TYPE truetype
	  SIZE 7
      POSITION AUTO
	  PARTIALS FALSE
    END
  END
  TOLERANCE 0
  TOLERANCEUNITS PIXELS
PROJECTION
    "init=epsg:4269"
END
END # layer

Berikut ini saya sertakan data spasial layer-layer yang nanti kita butuhkan dalam pengaplikasi mapserver dan chameleon

Written by jtv

Agustus 20, 2007 pada 12:11 pm

Ditulis dalam MapServer

14 Tanggapan

Subscribe to comments with RSS.

  1. ok mas … nice tutoz … yang menjadi pertanyaan saya, mapserver ini support untuk data 3D gak ya ??? thanks ya

    Bisa, dengan menggunakan java, saya belum pernah nyoba sih, URLnya: http://java.sun.com/products/java-media/3D/download.html

    pitrasacha

    Agustus 22, 2007 at 2:43 am

  2. Saya baru dalam mapserver, dimana saya bisa tau penejelasan awal mapserver + chameleon?

    Terima kasih.

    Untuk mempelajari mapserver + chameleon berikut URL nya: http://mapserver.gis.umn.edu/ dan http://chameleon.maptools.org/

    asmansjah

    Oktober 9, 2007 at 2:25 pm

  3. Good tutor.
    Saya sudah mencoba sampai disini, pertanyaan saya : Bagaimana mendapatkan(query) informasi dari tiitk(point) yang diinginkan??? Bagian mana yang harus dirubah???

    untuk mendapatkan informasi pada suatu titik, terletak pada javascript nya. Jika maksud pertanyaan mas andra, informasi pada kolom mana yang mau ditampilkan di file dbf, caranya adalah sebagai berikut:

    LAYER
    GROUP “Point”
    NAME puskesmas
    METADATA
    “DESCRIPTION” “Puskesmas”
    “RESULT_FIELDS” “PUSKESMAS” // informasi yang akan muncul di setiap titik
    “GROUP” “Point”
    “LAYER” “puskesmas”
    END
    TYPE POINT
    STATUS OFF
    DATA puskesmas
    LabelItem “PUSKESMAS” // informasi yang akan muncul di setiap titik
    CLASSITEM “ID”
    CLASS
    TEMPLATE “ttt_query.html”
    SYMBOL 1 // Tampilan untuk symbol titik
    SIZE 8

    NAME “Puskesmas”
    LABEL
    COLOR 255 0 0
    FONT fritqat-italic
    TYPE truetype
    SIZE 8
    POSITION AUTO
    PARTIALS FALSE
    OUTLINECOLOR 255 255 255
    END
    COLOR 0 0 0
    END
    TOLERANCE 5
    PROJECTION
    “init=epsg:4269″
    END
    END # Layer

    andra

    November 8, 2007 at 4:27 pm

  4. Trima kasih responnya. Yang saya maksud disini script untuk menampilkan informasinya :) Tolong ya mas… bingung berat nih. O ya ada pertanyaan tambahan. Saya ada dapat citra landsat sebuaug daerah. File”nya berextensi .alg, .aux, .ers, .rrd, .erv ,buka filenya pake apliaksi apa ya??

    Kalau untuk menampilkan informasinya, kamu bisa liat javascript yang ada di mapserver, karena chameleon sudah menyediakan modul untuk menampilkan informasi berdasarkan data yang ada di dbf peta, script tersebut akan muncul jika kita mengklik point/polygon.

    kalau mau cari informasi tentang sebuah ekstensi file, kamu bisa mengunjungi website Filext.com, nanti bisa search di situ.

    andra

    November 12, 2007 at 11:10 am

  5. keren,,
    udah ada dalam bentuk bukunya belum mas,,? bisa jadi tutor ke kampus ga,,?
    thx,,

    bukunya belum jadi, insya Allah tahun depan, nanti bisa tolong kami untuk distribusi yah…hehehe…. insya Allah bukunya gratis, cuman bayar biaya cetak dan biaya distribusi aja.

    vina

    Desember 3, 2007 at 12:48 pm

  6. akhirnya nemu lagi web yang berbobot, thx tutorialnya
    kalo udah jadi bukunya tolong informasikan ke email saya, n kalo bisa bahasan mulai dari cara pembuatan data spatial/ peta

    thx

    ocre bos, mudah2an bisa menjadi solusi buat temen2, terima kasih support-nya

    tedy

    Desember 4, 2007 at 10:14 am

  7. wah Alhamdulillaah saya nemu tutorial yang mas bikin. kemaren2 saya mentok banget, sekarang ada titik terang.

    Halo mas Donny

    mas, saya boleh nanya ya

    1. di chameleon kan sudah ada chameleon.map yang ada di root \ms4w\apps\chameleon\samples\map, menurut mas, apa saya cukup modifikasi file chameleon.map tersebut sesuai file shp yang saya pakai, atau saya buat chameleon.map yang baru?

    Perubahan file MAP menyesuaikan dengan kebutuhan dan file SHP yang digunakan

    2. di chameleon.map yand sudah ada di root tersebut, EXTENT dan PROJECTION nya berbeda dengan yang ada dalam tutorial mas :

    di chameleon.map yang sudah ada :
    EXTENT -2594561 -712631 3467361 3840000

    PROJECTION
    “init=epsg:42304″

    di tutorial mas :
    EXTENT 287087.190338 9236933.007130 296637.946419 9242847.100283

    PROJECTION
    “init=epsg:4269″

    kenapa ini berbeda, mas? gimana cara menentukan EXTENT dan PROJECTION nya? karena peta shp saya masih belum bisa muncul. apa mungkin ini sebabnya?

    Memang berbeda, karena pada kasus di tutorial, saya tidak memiliki data projection yang digunakan pada SHP, oleh sebab itu saya menggunakan berbeda, agar didapatkan koordinat real-world yang sesuai.
    Untuk perbedaan Extent dan Projection akan saya jabarkan di tutorial berikutnya di Blog Mapserver

    3. dalam tutorial mas, mas mencontohkan menggunakan “Sample using XML Theme Legend” untuk diutak atik. kalau saya menggunakan “Sample using widgets from the Enhanced widget group” bisa gak mas? maksudnya, apa langkah-langkahnya sama? sebab saya pikir yang “Sample using widgets from the Enhanced widget group” tampilan layernya lebih simpel, tidak dibagi2 jadi “raster”, “polygon”, “line”, “point” dan “other”.

    Penggunaan halaman sesuai dengan kebutuhan

    4. ketika membuka sampel chameleon yang “Sample using XML Theme Legend”, seperti dalam tutorial mas, itu nge-link nya ke “sample_enhanced_themelegend.phtml” kan mas. kemudian saya buka file phtml tersebut pake macromedia, dan sebagian isi file nya begini:

    <?php
    /*
    * this is a sample of a minimal application script required to
    * get a chameleon application running with a template and a
    * local map file. Most applications should actually just
    * copy this file and modify the template and mapfile
    * parts and should not need to do a lot more here.
    */
    include( “../../htdocs/chameleon.php” );

    $szTemplate = “./sample_enhanced_themelegend.html”;
    $szMapFile = “../map/chameleon.map”;

    isinya saya artikan bahwa sample_enhanced_themelegend.phtml membaca 3 file untuk bisa bekerja yaitu chameleon.php, sample_enhanced_themelegend.html, dan chameleon.map. bener gak mas, kalau saya artikan begitu? kemudian pertanyaan saya: untuk bisa menampilkan peta shp nya, apakah konfigurasi harus dilakukan di ketiga file tersebut atau cukup mengkonfigurasi chamelon.map saja?

    jups, mas Donny betul, untuk konfigurasi file SHP hanya dilakukan di file MAP

    gitu dulu ni mas. mohon bantuannya ya mas, karena saya belum berhasil menampilkan peta shp nya. saya udah mumet banget ni mas utak atik jungkir balik atas bawah depan belakang, kok masih belum berhasil. penasaran mas, apanya yang masih gak bener.

    sebelumnya makasih banget ya mas..
    -don-

    donny

    Januari 30, 2008 at 2:12 pm

  8. oke, sip. matur suwun, mas. terimakasih banget, mas atas tanggapannya. please keep doing this good work of yours, helping us having difficulties.

    -don-

    ok, sebisa saya mas donny, GL…

    donny

    Februari 5, 2008 at 5:20 pm

  9. mas boleh tanya lagi ya.

    saya tetep belum bisa menampilkan petanya ni mas.
    saya sudah mengkonfigurasi file chameleon.map sesuai file SHP yang saya pakai, tapi belum peta tersebut belum bisa ditampilkan.

    kemudian coding dalam tutorial mas dari “membuat file map bagian pertama sampai ketiga” saya coba di run di mapserver. coding tersebut copy di wordpad dan saya save as “chameleon.map” kemudian saya masukkan di c:\ms4w\apps\chameleon\sample\map, sedangkan file chameleon.map yang asli saya pindahkan dulu. shapefile dari tegal.zip yang mas sertakan saya masukkan di c:\ms4w\apps\chameleon\sample\data\tegal. peta tersebut masih belum bisa ditampilkan. yang keluar adalah eror yang sama:


    Warning: [MapServer Error]: msLoadMap(): in C:\ms4w\apps\chameleon\htdocs\common\wrapper\map_session.php on line 215

    Warning: Failed to open map file C:\ms4w\apps\chameleon\samples\htdocs\/../map/chameleon.map in C:\ms4w\apps\chameleon\htdocs\common\wrapper\map_session.php on line 215

    Fatal error: Call to a member function set() on a non-object in C:\ms4w\apps\chameleon\htdocs\widgets\KeyMap\KeyMap.widget.php on line 197

    saya udah buka map_session.php on line 215 adalah: $this->oMap = ms_newMapObj($szMapFile, $szMapFilePath);

    sedangkan KeyMap.widget.php on line 197 adalah: $oExt->set( “minx”, $this->maParams["MINX"] );

    saya pakai ms4w versi 2.2.6 dan chameleon 2.4
    mohon bantuannya mas

    terimakasih, mas
    -don-

    Ok, saya coba cek dulu yah

    donny

    Februari 19, 2008 at 12:23 pm

  10. mas mo tanya nich… klo buat munculin statistik contentnya dalam bentuk chart bisa ga ya klo lewat web? mohon penjelasannya , thanks…

    jpodnegara

    Mei 26, 2008 at 9:55 am

  11. Statistik untuk layer SHP ? kalau gitu bisa menggunakan widget OWTChart di chameleon, letaknya di C:\ms4w\apps\chameleon\htdocs\widgets\OWTChart

    klanjabrik

    Mei 26, 2008 at 11:14 am

  12. Untuk pertanyaan mapserver, bisa mengunjungi http://mapserver.wordpress.com/, thanks

    klanjabrik

    Mei 26, 2008 at 11:14 am

  13. maaf mau tanya saya ingin membuat peta interaktif tapi saya tidak tau harus mulai dari mana,pakai sofware apa

    maksih

    ax_deco

    Agustus 2, 2008 at 2:30 am

  14. mas mau tanya nich….
    saya mhsw tk 4 yang sedang menyusun script ttg GIS, saya baru mengenal GIS. GIS yang akan saya buat tentang peta ruang kuliah di kampus saya. Data yang tersedia dlm bentuk .dwg, data ini udah saya convert ke dlm benruk .shp memakai software CAD2Shape 4.0, trus udah saya edit juga .dbf ny. Yang mau saya tanyakan : kenapa saat dibikin mapfile dan kemudian di running, peta ny ga muncul sama sekali (padahal syntaknya baru dalam bentuk peta sederhana)?, g ada pesan error juga (berarti syntak2 yang udah saya bikin g ada kesalahan kan..??) trus salah ny dimana tuch mas?
    mohon penjelasannya…
    terimakasih sebelumny…

    Tidak munculnya peta bisa disebabkan karena projection tidak tepat atau koordinat georeference tidak pas, kalau mau diskusi lebih lanjut, join ke klanjabrik.com aja, thanks…

    windy

    Agustus 22, 2008 at 1:10 am


Tinggalkan Balasan