Open Layer บทที่ 1

Standard
หลังจากดูคนอื่นใช้กันมานาน ก็หาโอกาสจะทำ app สักตัวที่ใช้ OpenLayers มานาน มาถึงวันนี้ก็เริ่มกันสะที

ดูรวม ๆ OpenLayers เป็น API tool ที่ใช้งานง่าย สำหรับงานง่าย ๆ เช่นเปิดมาหน้าแรก add layer ตามตัวอย่างที่มีเยอะแยะใน web

ขั้นต้นก็ add Openlayers.js
<script src=”OpenLayers.js”></script>

เริ่มต้นหากจะ add layer ก็ทำตามตัวอย่างไป คงไม่อธิบายว่าทำอย่างไรแต่เกร็ดน่าสนใจคงเป็นการ add Base/Overlay

ดูเหมือนว่าจะ detect เอาเอง โดยหากต้องการระบุให้ WMS เป็น overlay ก็ต้องเพิ่มในส่วน

transparent: “true”, format: “image/png”

var wms = new OpenLayers.Layer.WMS("NASA Global Mosaic",   <---name
                                 "http://wms.jpl.nasa.gov/wms.cgi", <---url
                                 {layers: "modis,global_mosaic"}, <---params
  {'projection':none});  <---options

ตัวอย่างจริง

layersensor = new OpenLayers.Layer.WMS(   'sensor',"http://mizu.info.gscc.osaka-cu.ac.jp/waterwqiop/owsraster.php", 
             {layers: 'sensor','gszMapName':'/home/msapp/water/wcs.map','wpsoutputs':'/var/www/html/wpsoutputs/',
             'resultpath':sosreference,'coln':coln.substring(4),'modelname':'sensor',transparent: "true", format: "image/png"});


ประกอบด้วย 4 ส่วนหลัก name,url,params และ options โดยที่สองตัวหลังจะต้องอยู่ในเครื่อง {} เพราะมีได้มากกว่าหนึ่ง

เกร็ดเล็กน้อยอีกอันก็คือ

คำสั่งเป็นการเพิ่ม หลาย Layers ในครั้งเดียว

map.addLayers([layer, lakewms]);

และ เพิ่มแค่ 1 layer

map.addLayer(layer);

จากที่พยายามทำ app ขึ้นมา ก็ใช้งานได้ดี มีความสามารถหลากหลาย มากมายแต่ คงต้องบอกว่า ตัวอย่าง (มีแต่แบบง่าย ๆ แสดงไว้) หรือ document ยังขาดแคลน ทำให้ยังไม่สามารถใช้ประโยชน์ได้เต็มที่

Powered by ScribeFire.