Download - demo open layer 2
![Page 1: demo open layer 2](https://reader033.vdocuments.us/reader033/viewer/2022061218/5481398fb479594b578b480d/html5/thumbnails/1.jpg)
Demo OpenLayer 2Adi Triyatmoko, S.Kom
Prak. Multimedia Spasial Pertemuan Ke 3
Sistem Informasi Kamis, 3 Juni 2010
![Page 2: demo open layer 2](https://reader033.vdocuments.us/reader033/viewer/2022061218/5481398fb479594b578b480d/html5/thumbnails/2.jpg)
Tujuan
2
Demo OpenLayer 2 Halaman 2
• Jenis-jenis Controls
• Cara Menambah Controls
• Membuat Popup
![Page 3: demo open layer 2](https://reader033.vdocuments.us/reader033/viewer/2022061218/5481398fb479594b578b480d/html5/thumbnails/3.jpg)
Sekilas Controls
3
Demo OpenLayer 2 Halaman 3
• Controls adalah cara sebuah OpenLayer untuk berinteraksi dengan user
• Terdapat 30 macam controls yang dapat digunakan.
• Pada umumnya, hanya 10 macam
![Page 4: demo open layer 2](https://reader033.vdocuments.us/reader033/viewer/2022061218/5481398fb479594b578b480d/html5/thumbnails/4.jpg)
Jenis-jenis Controls
4
Demo OpenLayer 2 Halaman 4
1.Navigation – makes the map draggable, provides the mouse and keyboard actions
2.PanZoom – the default compact navigation controls
3.Attribution – a label usually displayed at the bottom right of the map that gives any appropriate copyright credits
4.LayerSwitcher – a pop-out control that allows the visible layers to be changed
5.PanZoomBar – extended version of the PanZoom control, giving an indication of zoom levels available
![Page 5: demo open layer 2](https://reader033.vdocuments.us/reader033/viewer/2022061218/5481398fb479594b578b480d/html5/thumbnails/5.jpg)
Jenis-jenis controls
5
Demo OpenLayer 2 Halaman 5
6. Permalink – creates a hyperlink to current map view
7. ScaleLine - a small line indicator representing the current map scale
8. NavigationHistory – allows the navigational history of the map to be replayed
9. OverviewMap10.GetFeature/WMSGetFeatureInfo –
interface to query the server for features under a click
![Page 6: demo open layer 2](https://reader033.vdocuments.us/reader033/viewer/2022061218/5481398fb479594b578b480d/html5/thumbnails/6.jpg)
6
Demo OpenLayer 2 Halaman 6
• Navigation
PanZoom
LayerSwitcher
PermalinkOverviewMap
ScaleLine
![Page 7: demo open layer 2](https://reader033.vdocuments.us/reader033/viewer/2022061218/5481398fb479594b578b480d/html5/thumbnails/7.jpg)
Cara Menambah Controls
7
Demo OpenLayer 2 Halaman 7
map = new OpenLayers.Map('map', { controls: [ new OpenLayers.Control.Navigation(), new OpenLayers.Control.PanZoomBar(), new OpenLayers.Control.LayerSwitcher(), new OpenLayers.Control.Permalink(), new OpenLayers.Control.ScaleLine(), new OpenLayers.Control.Permalink('permalink'), new OpenLayers.Control.MousePosition(), new OpenLayers.Control.OverviewMap(controlOptions), new OpenLayers.Control.KeyboardDefaults() ], });
![Page 8: demo open layer 2](https://reader033.vdocuments.us/reader033/viewer/2022061218/5481398fb479594b578b480d/html5/thumbnails/8.jpg)
Popup
8
Demo OpenLayer 2 Halaman 8
• Popup adalah tampilan yang muncul karena user mengklik simbol didalam peta.
• Isi popup ini bisa berupa informasi tambahan mengenai data spasial yang terdapat dalam peta.
• Isi data tersimpan ke dalam file XML
![Page 9: demo open layer 2](https://reader033.vdocuments.us/reader033/viewer/2022061218/5481398fb479594b578b480d/html5/thumbnails/9.jpg)
Demo Popup
9
Demo OpenLayer 2 Halaman 9
![Page 10: demo open layer 2](https://reader033.vdocuments.us/reader033/viewer/2022061218/5481398fb479594b578b480d/html5/thumbnails/10.jpg)
Click Symbol Ballon
10
Demo OpenLayer 2 Halaman 10
![Page 11: demo open layer 2](https://reader033.vdocuments.us/reader033/viewer/2022061218/5481398fb479594b578b480d/html5/thumbnails/11.jpg)
Cara menambahkan Popup
11
Demo OpenLayer 2 Halaman 11
var new = new OpenLayers.Layer.GeoRSS('Tourism Location', 'xml/tourism.xml');
![Page 12: demo open layer 2](https://reader033.vdocuments.us/reader033/viewer/2022061218/5481398fb479594b578b480d/html5/thumbnails/12.jpg)
Isi File XML
12
Demo OpenLayer 2 Halaman 12
<item><link>http://platial.com/place/90306</link><title>Senayan</title><description><![CDATA[Senayan adalah kelurahan di
kecamatan Kebayoran Baru, Jakarta Selatan, Jakarta, Indonesia. Kelurahan ini memiliki kode pos ... dengan kode wilayah 31.71.060.010. Kelurahan ini memiliki penduduk sebesar ... jiwa dan luas ... km2. Kelurahan ini berbatasan dengan ... di sebelah utara, ... di sebelah barat, ... di sebelah timur dan ... di sebelah selatan. ]]>
</description><georss:point>3,75 -44,75</georss:point></item>