?

PGIS大數據量點位顯示方案

?

?

問題描述

PGIS在地圖上顯示點位信息時，隨點位數量的增加瀏覽器響應速度會逐漸變慢，當同時顯示上千個點時瀏覽器會變得非常緩慢，以下是進行的測試：

測試環境：

• 服務器：

CPU：Intel(R) Xeon(R) 2.00GHz ，4核

內存：2G

• 客戶端：

CPU： E5200@ 2.59GHz， 2核

內存：2G

????下面是測試結果：

點位數量	IE內存占用	平均響應時間	放大縮小	點擊響應時間
100	44.22M	基本無延時	1 S	基本無延時
400	49.09M	0.1 S	1.5 S	基本無延時
900	62.67M	0.3 S	3 S	基本無延時
1500	67.85M	1.5 S	5 S	基本無延時
10000	164.104M	不能拖動	不能縮放	?

?

原因分析

以下是從PGIS顯示原理和平臺代碼實現方式兩個方面進行的分析。

PGIS顯示原理

山海經緯PGIS利用微軟的VML技術在地圖上描繪一個點位，每個點位信息最終都生成一個div圖層，覆蓋到地圖圖層上。當同時顯示上千個點時，瀏覽器要同時渲染上千個div圖層，非常影響性能。

平臺顯示點位信息的方法

平臺在批量顯示點位信息時，分3個步驟進行：

首先查詢平臺業務數據庫，獲得安裝點編號的集合。

根據安裝點編號集合拼接查詢條件，到PGIS空間數據庫中查詢需要顯示的安裝點集合。

循環PGIS查詢出來的安裝點集合，顯示到地圖上。在循環中同時查詢業務數據庫，獲得每個安裝點的詳細信息，作為彈出信息窗的內容。

現行做法存在的問題

業務數據庫中沒有存安裝點的坐標，需要同時查詢業務庫和PGIS空間庫才能將安裝點顯示出來。

安裝點明細信息沒有進行緩存，每顯示一個安裝點都需要查詢一次業務數據庫。

一次將所有點位顯示出來，當點位太多時影響瀏覽器的響應速度，很多圖標疊加在一起也影響界面的美觀性。

優化措施

根據以上分析，可以從以下幾個方面進行優化。

視野范圍內加載

• 思路

  可以考慮只加載在視野范圍內的安裝點，以減少瀏覽器渲染的壓力。

• 分析

  將當前所有點位信息儲存在一個數組中。當需要批量顯示點位信息時，找出數組中在當前視野范圍內的點并進行展示。

• 實現

以下是用到的PGIS相關接口:

查詢當前地圖顯示范圍：var boundsMBR =_MapApp.getBoundsLatLng()。

查詢指定點是否在指定顯示范圍內：boundsMBR.containsPoint(Point)

隱藏一個圖層。 PGIS沒有提供隱藏一個圖層的接口，但一個圖層根本上來說是一個div，可以通過隱藏div來實現：pOverLay.div.style.display='none';

刪除一個圖層: _MapApp.removeOverlay(pOverLay)

具體的代碼：

//隱藏當前視窗范圍外的圖層 ????????????????function hidePointsOutOfBounds(){ ????????????????????var boundsMBR=_MapApp.getBoundsLatLng(); ????????????????????var zoomlevel=_MapApp.getZoomLevel(); ????????????????????for(var i=0;i<layerarray.length;i++){ ????????????????????????pOverLay = layerarray[i]; ????????????????????????if(boundsMBR.containsPoint(pOverLay.getPoint())){ ????????????????????????????if(layerflag &&((i+1)%zoomlevel!=0)){ ????????????????????????????????_MapApp.removeOverlay(pOverLay); ????????????????????????????????pOverLay.div.style.display='none'; ????????????????????????????}else{ ????????????????????????????????if(pOverLay.div.style.display=='none'){ ????????????????????????????????????pOverLay.div.style.display=''; ????????????????????????????????????_MapApp.addOverlay(pOverLay);???? ????????????????????????????????} ???????????????????????????????? ????????????????????????????} ????????????????????????}else{ ????????????????????????????if(pOverLay.div.style.display==''){ ????????????????????????????????_MapApp.removeOverlay(pOverLay); ????????????????????????????????pOverLay.div.style.display='none'; ????????????????????????????} ????????????????????????} ????????????????????} ????????????????}

?

分層加載

• 思路

  如果一次將所有點位顯示出來，相鄰的點位會緊挨在一起，整個地圖看起來元素很多，也不方便用戶進行操作?？梢钥紤]分層加載方法減少同時加載的點位數量。

• 分析

  給每個點位設定層級范圍，地圖顯示時獲得當前比例尺層級，只顯示當前層級下指定的點位。

• 實現

  新增安裝點層級表。表結構如下：

  MONITOR_POINT_LAYR

名稱		代碼	數據類型		注釋	默認值
安裝點編號		POINTCODE	NVARCHAR2(16)		?	?
最大層級		MAXLAYER	NVARCHAR2(2)		?	?
最小層級		MINLAYER	NVARCHAR2(2)		?	?

在前臺顯示數據時，首先獲得當前層級：

var zoomlevel=_MapApp.getZoomLevel();

然后循環安裝點列表，獲得每個安裝點的最大層級和最小層級，判斷是否滿足條件：

minlevel<=Zoomlevel<=maxlayer

只有滿足該條件的安裝點才進行顯示。

不加載標題

• 思路

安裝點標題現在默認顯示在點位信息上面，可以考慮默認不顯示標題，當鼠標移動到點上時再加載。

• 分析

  每個安裝點標題都占據一個單獨的div層級，點位多時標題會擠在一起，影響美觀性，也不方便查看。

• 實現

  每個安裝點在加載時默認隱藏標題：

  marker.hideTitle();

  添加鼠標監聽事件，當鼠標移動上時顯示標題，移出時隱藏標題：

marker.addListener("mouseover",function(){marker.showTitle()});????marker.addListener("mouseout",function(){marker.hideTitle()});

坐標點存儲

• 思路

  目前顯示安裝點需要同時查詢業務庫和PGIS空間數據庫。業務庫獲得安裝點明細信息，空間庫獲得經緯度坐標。單純的數據展示可以考慮只查詢一個數據庫。設計到空間搜索等問題時再查詢PGIS空間庫。

• 分析

  將安裝點的坐標存到業務庫中，這樣在批量顯示安裝點時候不需要查詢PGIS空間數據庫就可以了。只有涉及到空間查詢如點周邊查詢等操作時才操作PGIS空間數據庫。

  另外，可以在本地業務庫中建立一張安裝點空間表，將空間數據儲存在自己的業務庫中，這樣空間查詢等功能就不需要依賴PGIS提供的接口了，空間字段是Oracle提供的標準格式，更便于以后功能的擴展。

• 實現

  平臺monitor_point表已經有經緯度字段來，添加安裝點時將經緯度數據填進去即可。具體代碼略。

  本地安裝點空間表結構如下：

  MONITOR_POINT_GEOMETRY

名稱		代碼	數據類型		注釋	默認值
安裝點編號		POINTCODE	NVARCHAR2(16)		?	?
空間字段		GEOMETRY	MDSYS.SDO_GEOMETRY		?	?

數據緩存

• 思路

  平臺現在是實時查詢數據庫獲得安裝點信息，并展示在地圖上?？梢钥紤]將安裝點信息緩存起來，調用的時候直接從緩存里讀取數據，可以省掉查詢數據庫的操作。

• 分析

  數據緩存可以在瀏覽器客戶端緩存和服務器端緩存2種方式。

  瀏覽器端緩存速度最快，但需要耗費瀏覽器端的內存，一條安裝點的所有信息約占900個字節，經過實際測試，在客戶端內存中緩存2179條數據，約占1.8M內存，并不影響瀏覽器響應速度。但當緩存約8000個點左右時會內存溢出。

  因此可以考慮采用瀏覽器端和服務器端雙重緩存的方案。只將基礎數據（坐標點、安裝點編號、名稱、類型）緩存在瀏覽器客戶端，將明細信息緩存到服務器端。

• 實現

  首先查詢數據庫將安裝點基礎信息緩存到瀏覽器客戶端，存在js數組里。當顯示某類安裝點時循環該數組將符合條件的安裝點顯示出來。

  在服務器端查詢數據庫將明細信息緩存到一個cache文件中。該文件定時刷新以保證數據的及時性。當對安裝點表進行操作時也實時將數據更新到cache文件中去。

  點位聚合

  參考點位聚合方案

  ?

  專題圖疊加 ※

• 思路

  以上優化辦法主要針對平臺現有的地圖顯示需求，如果用戶有大屏幕顯示等特殊需求需要同時顯示上千個點位，可以考慮專題圖疊加功能。

• 分析

  PGIS提供專題圖疊加的接口，可以通過WMS協議調用第三方地圖圖片（如GeoServer）疊加到地圖上。利用GeoServer等地圖服務預先將安裝點圖層生成出來，利用PGIS的專題圖疊加接口調用該圖層。

• 實現

首先利用GeoServer生成一個安裝點圖層。

利用PGIS的接口調用該圖層進行展示：

var legendfunc=new LegendFunc(); legendfunc.format=geoserverURL+"/wms?service=WMS&version=1.1.0&request= GetMap&layers="+layers+"&bbox=EZBOX&width=EZWIDTH &height=EZHEIGHT&srs=EPSG:4326&format=image/png &TRANSPARENT=true&cql_filter="+escape(cql_filter)+" &styles="+styles; legendfunc.open(_MapApp);

?

轉載于:https://www.cnblogs.com/xiaobinggg/p/4268073.html

總結

以上是生活随笔為你收集整理的PGIS大数据量点位显示方案的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。