I h t
Instalasi pmapper l.
paket pmapper ke direktori C:\ns4w\apps\pmapper-3.2.0 Pk*.t Paket Pmapper (versi terbaru bisadiiiinlr"dail;.'#;tiots.org
terdiri aras
:
Llate
ffinpe*e luft+p* &bi,tma.a
setiap isi dari foldgr tersebr{ lerupa konfigurasi ketika kita menambatrkan suatu aplikasi ke dalam Mapsever. Jadi, k&ka rcita menam-tarrilan suatu aplikasi kita perlu melaknkan sesuafu dengan isi ketigan amafordertersebut*-
a.
Folder Apache berisi
:
ilff n** =+$ffiffi#J*
I F
I r
!
setiap kita menambahkan suatu aprikasi pa:r.Ftu juga harus menambah reanfiteserupa dengan di atas detrg* nama.fotder aprikas-i usarrakan namafolder aplikasi kita untuk *.rooOrmt LrTd,d.TgT oooe-kocre dr atas nantinya alan muncul di halam an browirrseperti
6d;Jliutit*.ptg.hrmlr,
*.'
ini
:
pm.pp€r3.20-EU|LD
I
*ryCI e-maaoaruocryneaatan
Q
omamer*r*i(fl
omar.aa.meiatr+lrs
b.
(il
Folder apps berisi
ffi
#*
:
pmamer-3.10
'|;J
,fl
:-\ "1e9. ,idl -
r? ;*
tlFx", IJrryz
iSli " I3t** jjgj -,;;'" tL) i-\
q
-rua
st,,::"'
a
4
LJ -ry
t: *
j:-'
-:jatfu
jgj:t" #i*,r*r
4).t-"
lJ+.q
*jfl,";'
'-l'rryp
Eg";
J\,q-
'
Q.Ji.,ffi
"
*gJ
r'
lottt'i:.'9t* -uj-.
Q_lv= :-iry* iF
,.
.tigl
.-i
ry+ -,
.q'1
rr:*
iJ_
,a{i
.,.
-
I I T I I I I I
t t
T,empatfolder aplikasi kita disimpan. seperti layaknya htdocs di Xampp atau www di Wamp. Folder httpd.d berisi
ht$d-grnpper,onf COFF
fiffi,Effi 1
q
9,.,. OllEiotrs lBdeaes fol1owslrll.iEks llulElviews Order aLlourdeny {, :f',, Allow f,rou all. s '' Keterangan: (1) Nama/o/der aplikasi kita.
(2) (3) Direktori penyimpanan folder aptikasi kita. 2. Restart service Apache Ms4w web Server, yang terletak di direktori
I I I I r r
c:\ngw.
$ms.fimr*sbl.exc ffinrme-nsrrur.rrurr Elaoa*,.+"U.Urt E Ifflapadre<esuubat I
EI+adre*r*utat.bat fftseenv.bat H msronv,m ffi mn*a*wrse.txt H nrmc:nsrlu.m
T
l
ffe
116
I
t
:
J.
Buka kembdi htto://localhost, berikut adalah taurpilan halaman bagran bawah
:
Appllcations Iher8 ls cur8ntly I mEae spplicalton inelsltgd.
I prr.pp.r
3.2
0.
BUTLD
2008{3{6
d;mi'frrLaftffiilfsffi p.meprycto6umet7,E,tion N o.mamotlann€De@ p.tnaao€/,wiki
o.map,€r mellifttlH
tffi*F.-1_ti--:-
4. Terlihat satu (1) aplikasi telah terpasang, yaitu pmapper.
Untuk melihat contoh aplikasi
menggunakan pmapper, ktik link pmapper:start demo application.
Prnapper dinilai memiliki kefgngkapan fitr5 van-s lebih lengkap, dengan konfigurasi yang dapat dikatakan cukup mudah, apabila di6andingkan dengan1raieworkMapserver lainnya.
Pmapper Framework Berikut tools yang terdapat pada browser peta denganframework pmapper.
=
1. Pilih Layer : Pilih layer yang ingin ditaurpilkan dengan memberi tanda (rl) pada kotak di samping nama layer yang bersangkutan. Untuk melihat perincian pada masingmasing layer
klik tanda (+).
Pengatur skala : Untuk mengatur skala tampilan peta dapat dilakukan dengan dua cara : (a) memasukkam nilai skala pada kotak yang telah disediakan, atau (b) menggeser
scalebu sehingga diperoleh tampilan yang sesuai.
=
l'
T F T
h h h
h
ill@ 3. Referensi Map: Gerakkan kotak referensi untuk menampilkan bagim peta yang dituju. Sebalilnya jika tampilan peta berubah maka peta referensi juga akan menyesuaikan.
4. Pencarian
: Gunakan fasilitas
ini untuk mencari obyek dalam layer tertentu. Pilih layer
yang akan dicari melalui listbox search for, tuliskan oama obyeknya kemudian tekan
tombol Search.
h T T
t hI
h
h h h t* t*
I ll
: Armenia Ausrria Ar'dorra
l i is ,
Eclgium
1.:-
Bosnia cnd tlerzegovina
erlgaria Croatia Czech Rcpublic
Ocnmark Eetonia
Farpe Islands
Finland
:
Ffq.tGG
, l
Georgia
Germany
Gibrattar
!?
Hasil pencarian akan ditampilkan padajendela Query Result.
5. Download / cetak : untuk mencetak
peta pilih
Untuk Print Map muncul jendela berikut
print Map
atau Download.
:
Untuk Download muncul jendela berikut ini (datam bentuk image):
Hap Resolution for tlounload :
0
rso opr *zoo opr Osoo opr
6.
Terdapat pilihan untuk menentukan skala peta dan mencetak peta ke dalam dokumen
Ms Excel, Notepad atauPDF.
oE oU oE
7. Toolbox , berisi perangkat
&
'
sebagai berikut:
Zoomto full extend (melihat selurutr peta)
@
Back (melihat tampilan peta seperti sebelumnya)
@
Forward (melihat tampilan peta seperti setelahnya)
% %
s rD
W
Zoom in (memperbesar tampilan peta) 7-oom out (memperkecil tampilan peta) : Pan (menggeserpeta)
Identifu (melihat iuformasi afiibut dari obyek padapeta)
rg!
Is (D
e
Selest (memilih obyek pada peta)
Auto Identity (me,lrampilan ahibut obyek yang berada diatas kursor secara otomatis) Measrue (tool unhrk merghitung jarak antarobyek)
h, Point of Interest (mmambah obyek penting)
#
Refresh (memperbanri tampilan peta)
Bagaimana Pmapper Bekerja? {dikasi mulai betjalP \"o'ku sebuahfle y}B me-ngaadung Javasoript memanggil framebaru. Frame tersebut akan bgri$ peta y.aug dilislt
ii"o
Msal: Filenaure : latihan.php
<SCRIPT LANGUAGE-"JavaScriptl .2"> fimction openFrameg(sizevals" gl-anguage, config, startparameters) { var sizearray : sizevals.spli(#'); var winwidth = parselnt(sizearray[0]); var winheight = parseln(sizearray[ I ]); var winsize sizearray[2];
:
+ winsize + "&language:,, + gl,anguage + ^myw =vindow.open("map.phtnl?wiqsize:u uMapServerTestSuite,,-,*i6gr:, + + config startParameters, + winwidth l]&cgnfig=" ",heighFu + winheight + ..
"
t
Jnenubar==no,scrollbarauto,resizabl
e=yes,top:O JefFO,status=ye
)
J" ) ;
<SCRIPT>
<TITML>
),>Link untuk buka peta
Berikut tampilan di browser dan/ile latihan.php
Dari gambar di atas terlihat jika link:ufiitkbuka peta di-klik akan memanggil statement openFrames('820#580#small', 'ent, rrr'Iatihani. Nilai dari statemerrr tersebut akan menjadi bagr fungsi.-openFr:ames(sizwals, glanguage, config startparameters). Dari di atas maka nilai untuk masing-masing parametei imgsi olenFrames adalah sebagai ::lf-L Deil(ut Sizevals (menentukan r*tranframe) Winwidth (lebaframe) : g20 piksel Winheight (tingglframe) : 580 pilael Winzise (ukuran jendela) : small glanguange : en(english) config (menentukan namafile configyangdigunakan) : kosong : latihan Berikut pengaruh perubahan masing-masing pararneter
**+q. o
o o o
. (bahasa) r o startParameters
I
t t f I
t I
T
\ilgsgrtr
f
T
t T
t I
t
T
I I
t I
Winwidth : 600, winheighf 400
Nilai parameter diatas ake diberikan sebagai masukan bagi file map.phtml
PJ* ]*fdow.opa('mapphtul?winsize:ll * ,riosze * _,,&language=. + glangu4ge + "&config=' + config +-tiarrryami V"p6ffiestsuiu,' *width=', w^rr'rr- + wiawi.dth.+ 'ieighF" + -r
,'i_T^Y_i..
";;;;iaFno,rooluaoa,rtoreriJureueslep,4Jrt=0,*ffi,?rt ) Pada contoh diatas,
nilai pmmater config adalah kosong.
+
rl
lt ir ir ]
F F F lr tr lr I
Membuat Aplikasi webgis sederhana dengan Menggunakan Framework pmapper 1.
2.
Buat Folder baru di direktori c:\ms4w\apps dqngan nama latihan copy-kan isi folder c:\ms4w\apps\pmapper-{o n dalam folder latihan
#.*
i* )*
3: sfi'r
f F f
'lqascnbt
6t** glli.* H *H-- gj-* d1--"- *,'l--*
E]l'*:**
3. Di direktori c:\ns4w\Apache\htdocs
,.o. \
copy
purt,@l
prnryr.pkg.hrnt Fi'er*r lioriinren'r
Lalu rename dengan nama latihan,pkg.html kemudian edit isinya.
#ffi.+tffi
*
Wffi
5
la>
'
Selesai mengedit, Save
I
I
"D-
,mJ
ld** .Hr* g-* H-l* ,F':*": UT"
l
I
j: H: ii=
.--] wr.,r
gJIT:z. H:T* Hr**
ir
I
r-rry fi.,., ;*./t,..)"i[o.
latihan.pkg.htnl tersebut.
4. Di direkrori C:\ms4w\httpd.d copy paste |-I\ ;gr rre ' lfl
htsd-gnry.onf
LaIu rename dengan nama httpd pmapperconf temudran edrt isinya.
-)ir]ffiffi
+
I
I
T
I-
I I
I
A].iag
I J,
AItouo,t,erliEEne
5 fr 4
Options Indexes Folt.owSymtinks Mult,ivielrs Order allowrdeny &Ilow from all {/Directory>
statemen Alias /pmapper/ "/ms4da pps/pma ppe rJ.2.0,, menyatakan alamat web akan mengaksesy'/e yang tersimpan di direktori lqp://tocalhost/prrtapper "C:\rns4w\apps\pmapper-3.2.0\,.
wtu
I T
I I
il rl rl
Sel esai
mengedit, Sav e fi I e httpdjmapper.conf tersebut.
5.
Buat folder baru untukmenyimpan datashapefile yang akan digunakan di direktori C : \ms4w\a pps\latihan dengan naru folder data.
6.
Copy-kan data shapefile yang akan dimunculkan di browser pmapper ke direktori C :\ms4w\apps[atihan\data .
7.
Buat folder baru di direktori C:\ms4w\appsUatihan\config dengan nama folder latihan.
8.
Di direktori C:\ns4w\apps\latihan\config copy paste file
config.lt
{;niq^:rirl,:r
5,:
i::r'{::
ll'l ri8
Lalu rename dengan nama conlig-latihan.ini kemudian edit isinya. conffg_latihan.ini Configr"rau*n 5ettr.,g: 1fi r.E
i,l
rl
t
,:'t;l:..
I f
t t t I t t
, . t'
.
.:
't
rivers, jp1 lans gilobal mosaic ,:
ll il t
,irr:...:
9.
Di direktori C:\ms4w\apps\latihan\config\latihan copy
paste file di direktori C:\ms4w\apps\latihan\co.nfi g\default. File yang kita butuhkan adalah :
-: -
a.
-.
php config.php
,
. ,
me pmapper_demo.map menj adi latihan.map sesuai dengan pendefi mapfile di langkah ke-8.
10, Rena
ni sian
,r
r'r r rlt
11.
Edit fiIe latihan.map
# MapEile. created'with,.6ig,,g;pOit,fool *. # http: / /gix. sourceforge.net # Author :, Indah' KhuroUut. eint
143,.
L
t
rh
rr
r r r r r I r r I
I
,10
t9:-57 :48 2008
u
I
;
Nov
ft
I
i
rMon.
END
OIIT,PUTFO t'i NAME "png8(
r,r:
3q456352 6.7 52As875
I I I
OUTPUTFORMAT ' I\I+l{q,,,!! r
', .
:
jpe6,t'
;,,,,.,,,.;,i
:i'r rii'
:'''
. r.,..,...,,,,,,'.I,t1r,i...i.i,':.,,r.!,'r,ri.1i'
. ,, ,
DRTVER .'GD.IJPEGI'
r
:.':i'r ir
.,
''i"'."
MIMETYPE I,image/jP"9:: TMAGEMoDE
RGB ,,
,
'
',
FoRMAToprroN ;,euALrfy=7g,,
I
EXTENSfON
, , ljpg" :,, '
:"., .,;;'. ,
.:i";.
1:',.LL
it;'11;.:;
:
,'
Eli[Drl .' 1 :, 1.'r.,t r]::'. t t:,,;,.,,; i,i., ;..''.r..],r,1"r.,1 :, ::, , ;l.t.,..rrlr'i.tl'1.'ri',,il.i 'll:":'.,li' ..,: ,, I . '. ,,
r r r
,;,1rr::t
l;!l::l: i,:' f::i:,j.l.r:t:
,,ffiii'ii"inli ri
:f i,il:l
;:,':i]] :t:i,li.i
I
r I r
t
r r
r r
r r I
,1.:,,,,t,,].t ,.,]'
#
#
,,, ,,.],,, r, ,i:11
:il'
r ,: ,'.;,, .....1 ,':ti ' 1 1-,.,:11',,: II .::,.',', "_r
map
definition
;l;1
:
I
t
r
=
4 fr
BEFERENCE
T
,l,
I}iIAGE ,,,
t
#ili'ia ;,f;i;.ir;
rinu*r',rzi,iu.zziirarriffi srgg.,rigi
r/../images/inQo3rop. - jpg,, :
=
i
6.,?520987s
.
-.,.,
,.i"1i',.,,.' ,r,
T
r
I I t T
t
I t
r r r
r r r r
l
l#
il
#
#
r.
,.
STATUS embed. TRANSPARENT '"l
4
INTERVAIS
l
off: .
...- .' ,...'.-.:. . , ., ,: : ,
UUttS meters
,,
.
.,
l
CoLoR250250250,,.,]...]..,.,.
;;;il;;.;'o.;'b.,,,.''.,,,,,. BAcKGRouN,.o,o*.,bo:..roo,roo,,]'
sTYLEo....,.,,,.'.,.,l.,:,...;...,'...., POSTI"ABELCACHEETue ,: . t,.,. ',, .. ' , ,. r,aenl, ,ABEL I ,, .1',,.t,, ., . ,,..,-, .. ,1 .. ,, COIOR9090 , ,., ' COIOROOgO ,
,.'
vi..::r
r:!t,,r,..
'i ,'
'
i,,:.,,ii,,,
. #ourrrNECoLpR 2OO, #our],INECOLpR 2oo ZOO,200 zoo:2oo .:
SfZE smal.I .,,-. ,,, , , END # Label'.:';"-,'1.',
:
,
,
# - 'circle' alwaiys necessary (used e.g. for highlight) # - 'sguare r used in cu.recnt map fite # Symbots can also be defineJ via, tag SyMBOLSET (see above) ,
r: li'lii:
l '::
l,;;lr,';.
'l
I I I I I I I I I I I
12.
Edit file
I I I I I I I
'
jl*;t' li',.'i
-':
l.:a
: .
ir I I I I
searchitem name=,'propinsir, : name layer descripti_on=',propinsi', I deskripsi layer di bagian search Iayer type:,'shape,' :tipe layer (shape atau postgis) name:'rpropinsi,' : nama layef name=',NAtrdA_pRoptr : nama
field yang akan ditampilkan
description:"propinsi" ! deskripsi field yang akan ditampilkan wildcard:"0" : nilai wildcard 0 atau 1(jika wildcard = 0 maka pencarian
dilakukan sejak huruf pertama diketikkan, jika wildcard = 1 maka pencarian mengarnbil kata kunci yang diketikkan secara utuh).
r t t t
Search for Search fur
lv
Searctr
r r
t il t r t t r ,
iI
I
1
4. Edit file
di direktori c:\ms4w\apps\latihan\config
-startup_config.php $PU_BASECONrIC_DIR = sir_leplace (, \ \,,
5{
SPil_INI_rEE
5'.n
6,j
'lir l
I
'
"/. ,
, dillare {_rILE {srrles($coD!ig)
,} )
;
}:
($PU_I$I_FILE) ;
(issct(Sinil'pr, r.r:tq_ir.er:::, ,$PM_C0NFIG_LffiAIION
) elea
$lt
r\i
$PH_EeSEqff{mG_DIn,
$iai * parge_ini_fil.
,'t)
-13
-
I)
= SinL {' i:r.
)i
:rrr:-i
_: ::8,. - r.:.
1,.
{
$PU_COIIrIG_IOCATIOI
E sJefa,"itrtr,
l
15. Restart service Apache MS4W Web Server, yang terletak di direktori C:\ms4w.
I I
Srns{vrnnrhsta$.exe
ffinaonae-lr'rsrA[.hM iHapadre-instdl,bat
T
ffi"e"d.r"-*t"rtb"?l El
I
t r t
apactre
r.rrlrsU.
Ua
t
ffilsehnv.bat
ffi nrronv.ut SJ rnrsid-l$cerse.brt
ffi nrnmre-wsmu-.*t I 6.
Ketik httn :/fl ocalhost/
Latihrn Latihan Pmaroer
r r
T
I t t ;
17.
Untuk memberikan tampilan antarmuka C:\ms4w\appsUatihan yang berisi
sederhana, buat
file index.php di direktori
:
;
r I
t t ;
,
function openFrames (sizevals, glanguage, config, st.artparameters) { .varsi.zear'ray=sizeva1,s.spIit.(,#,.);.. var winwid.th = parselnt (sizearrayl0l ) ; var winheiEht = parselnt(sizearraylll ); var winsip. , l- sizearralrif2l, rl '' :: , l l ',:"'.
..'.
: '.,r
,l
"
I
('!Tlp.phtml?winsize:,, + winsize + "&langluage:,, + + "&config=" + config * startparameters, "width:" + winwid.th + "Theigh!=" + winheiqht llManserverTestsuite", "rmenubar:norscrollbar=autorresizable=yes{Lop=grleft=0r"a.ao":yis,,);
myw =window.open
q.Ianguage
'l
''l:l
I
:.'
ri
i
I ' 'l i l
,
18.
.''
.'
l
'rr: 'rr,r
(a href=!'javascr.ipt:openEiqaes untuk buka peta
(
!820#58O#smatrl,
l
r,',en,, ",' latihanr ),tllink
,'',,1,
Ketik http:/flocalhost/ Latihan Latihan Pmaooer
Link untuk buka neta
&eS-tS.
ol
-
tu,
e -!'"'-
m-
&tu
,fi*untr*u*g;G
tE.,!q.!
+
i
tr,9,,
.
€ *,QA'{*,'i,roirc",,,
