??? MapEasy群里面很多新朋友都不停的問到同一個(gè)問題，既然MapEasy是一個(gè)純粹的JavaScript地圖顯示客戶端那么她是如何與客戶自己的后臺地圖程序進(jìn)行整合，共同工作？這在MapEasy的設(shè)計(jì)之初就給了完美的解答，在MapEasy上實(shí)現(xiàn)與不同的地圖服務(wù)的對接是一件非常輕松而且靈活的事情。大家都可以看到在MapEasy的Sample里就給出了諸如Google、edushi、WOW、custom等多種后臺地圖服務(wù)的接口。
??? 但是由于各種歷史的原因Sample里只有edushi的地圖現(xiàn)在還可以正常工作，其他的可能已經(jīng)看不到圖片。很多朋友都以為是MapEasy的代碼的原因，其實(shí)不然，可以解釋為是MapEasy很久沒有更新的原因，那些地圖服務(wù)已經(jīng)不能取得地圖數(shù)據(jù)了。
??? 在這里特別感謝BeanSoft兄提出的建議，做一個(gè)在取本地圖片的的Sample，這樣就不會出現(xiàn)上述的地圖服務(wù)不能工作后Sample不能正常工作。最值得我敬佩的是他馬上動手做了一個(gè)
Demo，再次感謝分享！
??? 下面告訴大家實(shí)現(xiàn)與自己的地圖服務(wù)配合是一件多么Easy的事情（我們的目的就是讓Map更加Easy ^_^）。請大家注意MapType這個(gè)類，她就是MapEasy提供給大家擴(kuò)展自定義地圖服務(wù)類型的組件（我覺得在這里用組件這個(gè)詞更加貼切，因?yàn)樗m然夠簡單，但同樣夠強(qiáng)大和完整）。下面給出MapType類：
?1?function?MapType()?{
?2?????
?3?????this.enablePic;
?4?
?5?????this.disablePic;
?6?????
?7?????//~?Method
?8?????{
?9?????????this.enablePic?=?imgBaseDir?+?"maptype_0b.gif";
10?????????this.disablePic?=?imgBaseDir?+?"maptype_0a.gif";
11?????}
12?
13?????this.getSrc?=?function(level,?row,?column)?{
14?????????return?imgBaseDir?+?'zoom_'?+?level?+?'/'?+?level?+?'_'?+?column?+?'_'?+?row?+?'.jpg';
15?????}
16?
17?????this.getEnablePic?=?function()?{
18?????????return?this.enablePic;
19?????}
20?
21?????this.getDisablePic?=?function()?{
22?????????return?this.disablePic;
23?????}
24?}
??? enablePic、disablePic即顯示在左上角（當(dāng)然如果你愿意可以把她放在任何位置）的變換地圖類型的按鈕的圖片，分別為選中和非選中時(shí)的圖片。而getSrc方法就是實(shí)現(xiàn)與不同地圖服務(wù)對接的最重要直接的方法，默認(rèn)提供的方法是取本地圖片。getSrc方法提供了與不同數(shù)據(jù)源的接口，在getSrc中發(fā)揮你的聰明才智以最簡單的方式取得對應(yīng)瓦片的圖片就可以了。
??? MapEasy推薦的最佳實(shí)踐是編寫一個(gè)屬于自己的MapType，如WMSMapType，繼承MapEasy提供的MapType重寫getSrc方法實(shí)現(xiàn)自己的數(shù)據(jù)源接口。
??? WMS(Web Map Service)是OPENGIS的規(guī)范，應(yīng)用非常廣泛。下面給出一個(gè)以WMS服務(wù)為地圖數(shù)據(jù)源的簡單實(shí)現(xiàn)作為參考。
?1?/**
?2??*?自定義一個(gè)WMS數(shù)據(jù)源
?3??*?@author?crespo
?4??*/
?5?function?WMSMapType()?{
?6?
?7?????MapType.apply(this);
?8?
?9?????this.getSrc?=?function(level,?row,?column)?{
10?????????var?xMin?=?(MapModel.bound.getMinX()?+?((MapModel.bound.getWidth())?/?(new?Zoom(level).getBorderTilesNum()))*(column))/1e16;
11?????????var?yMin?=?(MapModel.bound.getMaxY()?-?((MapModel.bound.getHeight())?/?(new?Zoom(level).getBorderTilesNum()))*(row+1))/1e16;
12?????????var?xMax?=?(MapModel.bound.getMinX()?+?((MapModel.bound.getWidth())?/?(new?Zoom(level).getBorderTilesNum()))*(column+1))/1e16;
13?????????var?yMax?=?(MapModel.bound.getMaxY()?-?((MapModel.bound.getHeight())?/?(new?Zoom(level).getBorderTilesNum()))*(row))/1e16;
14?????????//alert("row?and?column"+row+","+column);
15?????????//alert(xMin+","+yMin+","+xMax+","+yMax);
16?????????return?"http://localhost:8080/geoserver/wms?bbox="+xMin+","+yMin+","+xMax+","+yMax+"&styles=population&Format=image/png&request=GetMap&layers=states&width=256&height=256&srs=EPSG:4326";
17?????}
18?}
??? 使用本機(jī)的geoserver服務(wù)器提供的WMS服務(wù)測試通過。
??? 趕快去擴(kuò)展你的地圖類型吧！
posted on 2007-02-07 10:59
cresposhi 閱讀(3425)
評論(9) 編輯 收藏