本文為一個openlayers項目的總結,其中可能有一些遺漏或描述得不準確的地方,望批評指正。
本文目標:
構建一個完全自定義的輕量級地圖信息系統,以openlayers為基礎,需要自定義地圖的元素樣式,包括圖層切換的樣式、地圖導航的樣式、地圖標記的實現、自定義彈出框等等。該專用地圖信息系統地圖來源于google地圖,包括普通地圖圖層、衛星影像圖層、路面信息圖層,另外自行畫了一些局部區域的三維地圖,本項目為企業內部項目,與互聯網隔離,故不可使用google的地圖api,則需要抓取google的相關地圖資源(暫時使用google地圖資源),利用openlayers構建輕量級專用地圖信息系統,這里的輕量級是指使用tilecache接口實現地圖圖層(相關資料見前篇博文)
實現的效果圖如下:

圖1 后臺管理頁面

圖2 前臺展示頁面(全屏顯示)
地圖相關說明:
地圖頁面事件說明
地圖基本功能
(1) 左上角的地圖瀏覽控件:包括地圖的上下左右移動,地圖的縮放
(2) 右上角三個選項,包括地圖、航拍、三維,點擊每個選項,出現相應的地圖視圖,其中地圖、航拍使用google地圖數據(下載google地圖)
(3) 能夠標注地圖的行政區域
(4) 鼠標在地圖上雙擊鼠標左鍵,放大地圖一個級別,鼠標滾輪向前向后轉動分別是放大縮小地圖一個級別,鼠標右鍵點擊,無響應事件
展示平臺功能
(1)主界面視圖
a) 有若干個個圖層,地圖下面有各個圖層的選項卡,點擊每個選項,顯示相應的內容
(2)局部區域視圖
a) 選中標記(點),跳轉到局部區域視圖
b) 點擊標記(點),根據項目的相應設置,顯示地圖下方的選項卡,點擊選項卡,顯示響應的內容
c) 鼠標放在標記(點)上時。出現提示框,鼠標移到提示框上面,可以點擊相應的鏈接,點擊鏈接之后,彈出一個對話框,并且鎖住地圖界面
地圖數據說明
地圖基本數據
(1)地圖圖片,要有連續的縮放級別的圖,每個級別之間相差2倍
(2)航拍圖片,要有連續的縮放級別的圖,每個級別之間相差2倍
(3)三維圖片,需要和地圖圖片、航拍圖片保持一致的大小,和縮放級別和地理位置
(4)地圖效果圖上面的使用的圖標和彈出窗口圖,需要原件,編寫css需要使用