基於Html+js實現的瓦片式的Webgis柵格地圖管理平臺

            基於Html+js實現的Webgis柵格平臺

 

成都領君科技提供的基於HTML5+js開發的瓦片式地圖發佈平臺，適用於幾乎全部瀏覽器(IE6+，遨遊，火狐，搜狗，谷歌，360，世界之窗，Opera等)。功能模塊包括以下兩個部分：矢量地圖生成切片工具和前臺javascript調用切片開發包。

1、       提供矢量數據生成切片處理工具。

原始數據能夠是mif數據或者shp數據，數據的組織格式能夠是一個工程地圖，也能夠是多個工程地圖，切片程序能夠自動組合多個工程展示出一幅完整的地圖。原始數據要通過數據處理程序處理成切片程序須要的格式，以此加快切片速度。(數據處理程序也由底層開發,讀取矢量數據，矩形切割)

 

切片程序能夠配置各類不一樣的顯示樣式，能夠配置出相似百度或者谷歌樣式的地圖。

 

切片程序能夠分塊切割地圖，即按照每一個格子來切割地圖，這樣，能夠實現多臺電腦切割不一樣的位置，切割完成，拷貝到一塊兒既可無縫鏈接。

同時，也能夠選取一個範圍進行切割，例如：地圖更新了某一塊區域或某一條道路，能夠只對這個範圍的數據進行切割，切完的圖片自動和之前的圖片拼接。切割的圖片爲256*256，大小通常爲 3到10K。

 

   切片程序也能夠對於專題圖層進行切割，生成透明PNG文件。

  

 

2、       基於Javascript前臺調用切片，在瀏覽器上實現地圖顯示

 

     前臺調用使用javascript和div動態異步加載地圖切片，實現地圖展現，

地圖中的全部點實現熱感知功能，即地圖上的每個點均可以點擊查詢。

 

 

1.熱點感知功能：鼠標移動到地圖上任意圖標上時自動提示，點擊返回事件。

 

2.放大、縮小：可拉框放大縮小地圖

3.測距：能夠在測距的同時放大縮小拖動地圖

4.測面：能夠在測面的同時放大縮小拖動地圖

5.圖片標記：能夠添加自定義圖片，鼠標移動到上面變成手指狀，點擊返回事件。

   

6.標記周邊一公里：能夠設置一個距離，畫出一個圓，實現周邊顯示。

：
7.文字標記：可在提示框上面動態標註一個字，點擊返回事件。

8.文本標註：能夠標註一行文字，點擊返回事件。

9.可移動圖標：能夠用鼠標選中圖標，並移動該圖標，移動結束返回事件。

10.圖上取點: 可在圖上點擊某個位置，返回當前點座標。

11.矢量點：能夠動態添加一個小圓點，鼠標移動到上面自動變色，

點擊返回事件。

 

 

12.矢量線：能夠動態添加一條線，鼠標移動到上面自動變色，點擊返回事件。

 

 

 

 

13.改變線色：能夠調用接口動態改變線的顏色。

 

14．矢量面：能夠動態添加一個面，鼠標移動到上面自動變色，點擊返回事件。

 

 

15.改變面色：能夠調用接口動態改變面的顏色。

 

16.學校專題、商場專題：能夠動態添加透明圖層，圖層中的全部點有熱感知功能。鼠標移動到上面變成可點擊狀，點擊返回事件。

 

17.畫線、畫面、畫矩形：可在地圖上畫一條線或者一個面，返回線或者面的點集合。

   鼠標移動到上面自動變色提示，點擊返回事件。

 

 

同時，能夠對當鼠標移動到線或面上的時候，能夠動態編輯線和麪。調用接口，返回編輯對象的點列。

  

 

 

 

 

18.刪除：能夠指定刪除添加的點，線，面，圖標，圖層等

 

備註：地圖加載實現異步加載，即圖片下載到本地緩存後才加載到網頁中。放大縮小時候，實現過渡效果，美化顯示。有效控制瀏覽器內存使用量，加快顯示速度。移動地圖或定位地圖時，都有自動滑動效果。

 

    添加標註圖標時，能夠把多個圖標組合到一個文件中，經過接口函數能夠從文件中取某一個圖標進行標註。

例如：從圖片集合中取進行標註