南海艦船數(shù)據(jù)可視化分析系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)

王桃蘋 王加勝* 王 健 劉宇晨

1(云南師范大學(xué)信息學(xué)院 云南 昆明 650500)2(西部資源環(huán)境地理信息技術(shù)教育部工程研究中心 云南 昆明 650500)

0 引 言

南海作為一道我國(guó)通向世界的海上大門，憑借得天獨(dú)厚的位置優(yōu)勢(shì)、資源優(yōu)勢(shì)，在我國(guó)經(jīng)濟(jì)貿(mào)易、對(duì)外交流中起著舉足輕重的作用。近年來(lái)，南海漁船事故、海上沖突爭(zhēng)端、海盜活動(dòng)時(shí)有發(fā)生，軍事活動(dòng)愈加頻繁，研究南海艦船的分布特點(diǎn)及軌跡規(guī)律對(duì)改善艦船運(yùn)行環(huán)境、提升南海航道的安全可以起到分析參考作用，為相關(guān)政策、法規(guī)的制定提供決策支持依據(jù)，對(duì)維護(hù)祖國(guó)領(lǐng)土完整和保障地區(qū)和平有著重大意義。

目前，基于地圖服務(wù)的船舶數(shù)據(jù)可視化分析系統(tǒng)在學(xué)術(shù)方面的研究呈現(xiàn)出國(guó)內(nèi)多國(guó)外少的趨勢(shì)。國(guó)內(nèi)比較典型的有：采用B/S架構(gòu)，基于OpenLayers(開(kāi)源地圖引擎)開(kāi)發(fā)了基于AIS的船舶軌跡分析與應(yīng)用系統(tǒng)[1]；采用MapInfo MapXtreme提供地圖服務(wù)，設(shè)計(jì)并實(shí)現(xiàn)了基于WebGIS的港口船舶動(dòng)態(tài)可視化系統(tǒng)[2]；基于ArcGIS Server開(kāi)發(fā)了B/S架構(gòu)的AIS動(dòng)態(tài)船舶管理系統(tǒng)，實(shí)現(xiàn)了地圖信息瀏覽、AIS數(shù)據(jù)解析、AIS船舶對(duì)象的顯示、查詢、跟蹤、統(tǒng)計(jì)、回放等功能[3]；采用B/S和C/S相結(jié)合的混合架構(gòu)，基于Geomedia組件技術(shù)，使用C#和ASP.Net開(kāi)發(fā)了基于GIS的船舶監(jiān)控系統(tǒng)，實(shí)現(xiàn)數(shù)字地圖的顯示及操作、報(bào)警處理、航行軌跡回放及歷史數(shù)據(jù)調(diào)閱等功能[4]；使用高德地圖作為基礎(chǔ)底圖，采用B/S架構(gòu)，使用Node.js、MongoDB與WebGL等相關(guān)技術(shù)開(kāi)發(fā)了基于WebGL的船舶大數(shù)據(jù)可視化原型系統(tǒng)[5]；采用C/S架構(gòu)，使用百度地圖作為基礎(chǔ)底圖，以Android客戶端+服務(wù)器+數(shù)據(jù)庫(kù)的模式開(kāi)發(fā)了基于Android船舶動(dòng)態(tài)實(shí)時(shí)監(jiān)控系統(tǒng)，實(shí)現(xiàn)了以船舶實(shí)時(shí)監(jiān)控、船舶信息查詢、船舶到岸提醒等為主要功能的手機(jī)應(yīng)用[6]等。國(guó)外方面使用MAPServer作為分析平臺(tái)，基于OpenLead和ExtJS實(shí)現(xiàn)了集地圖操作、船只定位、軌跡回放、船舶檢測(cè)報(bào)警等為一體的船舶監(jiān)控系統(tǒng)[7]。

綜上所述，國(guó)內(nèi)外研究多數(shù)采用B/S架構(gòu)、C/S架構(gòu)，結(jié)合OpenLayers、Arcgis Server、Geomedia、百度地圖、高德地圖等，呈現(xiàn)出多樣性，鮮有采用WebGL等其他技術(shù)對(duì)船舶數(shù)據(jù)分析結(jié)果進(jìn)行展示。因此探索可視化、圖表等技術(shù)在有關(guān)艦船問(wèn)題上的應(yīng)用也顯得有意義。本文基于百度地圖、南海艦船數(shù)據(jù)，結(jié)合可視化相關(guān)技術(shù)，設(shè)計(jì)了南海艦船可視化分析系統(tǒng)，給出了可視化技術(shù)、圖表技術(shù)等在艦船數(shù)據(jù)中應(yīng)用的解決方案，探索了大數(shù)量下如何保證系統(tǒng)穩(wěn)定運(yùn)行的方法。

1 研究區(qū)與數(shù)據(jù)

南海位于中國(guó)大陸南方，南北介于赤道與北回歸線之間(3°N～23°37′N)，西起東經(jīng)99°10′，東至東經(jīng)122°10′，資源物產(chǎn)豐富，是中國(guó)近海中面積最大、水最深的區(qū)域。在政治上因?yàn)槠涫俏覈?guó)通往歐洲、非洲、東南亞等國(guó)家的咽喉要道，自古以來(lái)便是兵家必爭(zhēng)之地，戰(zhàn)略地位十分重要。南海海上貿(mào)易往來(lái)頻繁，37條世界交通航線在此經(jīng)過(guò)，同時(shí)也是我國(guó)通向東南亞、新加坡等國(guó)的交通要道，扮演著經(jīng)濟(jì)發(fā)展與對(duì)外開(kāi)放的紐帶。

本文系統(tǒng)使用到的數(shù)據(jù)有地圖數(shù)據(jù)、南海艦船數(shù)據(jù)。地圖數(shù)據(jù)來(lái)自百度地圖(在線)，其提供了包括道路圖層、興趣點(diǎn)圖層、行政區(qū)劃圖層在內(nèi)的主要數(shù)據(jù)以及河流、海域等數(shù)據(jù)。艦船數(shù)據(jù)來(lái)自船訊網(wǎng)所購(gòu)買AIS數(shù)據(jù)，數(shù)據(jù)涵蓋了2015年11月30日-2015年12月2日三天共159萬(wàn)多條關(guān)于南海艦船的詳細(xì)信息，其中包括了船名、艦船編號(hào)、呼號(hào)、船舶吃水深度、船舶長(zhǎng)寬、航向、經(jīng)緯、度、時(shí)間等信息。

2 總體設(shè)計(jì)

2.1 架構(gòu)設(shè)計(jì)

系統(tǒng)采用B/S架構(gòu)，按四層模型，即數(shù)據(jù)服務(wù)層、地圖服務(wù)層、業(yè)務(wù)邏輯層、客戶層來(lái)構(gòu)建系統(tǒng)，如圖1所示。

客戶層中用戶通過(guò)瀏覽器瀏覽查看艦船點(diǎn)數(shù)據(jù)、熱力圖、艦船軌跡等經(jīng)由服務(wù)器對(duì)數(shù)據(jù)進(jìn)行處理的結(jié)果。業(yè)務(wù)邏輯層主要是服務(wù)器端對(duì)瀏覽器端所請(qǐng)求的數(shù)據(jù)和操作進(jìn)行分析處理，包括對(duì)艦船數(shù)據(jù)的統(tǒng)計(jì)分析、熱力圖、精確軌跡查詢、全部軌跡、艦船搜索等。數(shù)據(jù)服務(wù)層包含一個(gè)總體數(shù)據(jù)庫(kù)(南海艦船數(shù)據(jù)可視化與分析系統(tǒng)數(shù)據(jù)庫(kù))和三張表(艦船信息表、用戶信息表、艦船軌跡表)。

2.2 數(shù)據(jù)庫(kù)設(shè)計(jì)

該系統(tǒng)的數(shù)據(jù)庫(kù)由一個(gè)總體數(shù)據(jù)庫(kù)構(gòu)成，其中包含三張表，如圖2所示。設(shè)計(jì)時(shí)綜合考慮性能、需求等因素,為系統(tǒng)提供穩(wěn)定可靠的數(shù)據(jù)服務(wù)。

圖2 數(shù)據(jù)庫(kù)設(shè)計(jì)

2.3 軟硬件配置

南海艦船數(shù)據(jù)可視化與分析系統(tǒng)主要功能包括：艦船數(shù)據(jù)顯示、艦船數(shù)據(jù)詳細(xì)信息展示、搜索功能、熱力圖功能、詳細(xì)軌跡查詢功能、艦船各類信息統(tǒng)計(jì)分析功能、軌跡可視化等，如圖3所示。系統(tǒng)對(duì)軟件硬件的性能要求具體見(jiàn)表1。

圖3 系統(tǒng)功能模塊圖

接口軟件環(huán)境操作系統(tǒng)Windows 10處理器Intel(R) Core(TM) i7-4710HQ CPU @ 2.50GHz主板聯(lián)想 KL6(英特爾 HM65 芯片組 )內(nèi)存8 GB數(shù)據(jù)庫(kù)管理系統(tǒng)MySQL開(kāi)發(fā)環(huán)境WebStorm服務(wù)器WAMPSERVER 3.1.3(集成服務(wù)器)開(kāi)發(fā)語(yǔ)言HTML、CSS、JavaScript、PHP主要類庫(kù)Echarts、Jquery、百度地圖熱力圖庫(kù)、百度地圖大數(shù)據(jù)可視化庫(kù)地圖服務(wù)百度地圖JS API瀏覽器Chrome 66.0.3359.139、Firefox 59.0.3

2.4 詳細(xì)設(shè)計(jì)

以南海艦船軌跡可視化分析系統(tǒng)中幾個(gè)主要功能設(shè)計(jì)為例說(shuō)明該系統(tǒng)功能模塊的詳細(xì)設(shè)計(jì)情況。

1) 基礎(chǔ)功能模塊。主要是針對(duì)底圖的一些操作和輔助功能，利用百度地圖API提供的方法可以快速實(shí)現(xiàn)地圖的基礎(chǔ)功能。該系統(tǒng)中添加的基礎(chǔ)功能主要有：鼠標(biāo)縮放、衛(wèi)星/普通地圖切換、鷹眼、比例尺。

2) 時(shí)間軸功能模塊。時(shí)間軸使用Echarts繪制，將24小時(shí)以每5分鐘的間隔分割，用戶點(diǎn)擊時(shí)間軸上的時(shí)間點(diǎn)后會(huì)加載對(duì)應(yīng)時(shí)間點(diǎn)前后3分鐘內(nèi)的數(shù)據(jù)。時(shí)間軸功能的主要目的是控制數(shù)據(jù)量的多少。采用時(shí)間軸功能從時(shí)間點(diǎn)上將數(shù)據(jù)分離開(kāi)，既保證了的系統(tǒng)的穩(wěn)定性，也能更加清楚地呈現(xiàn)數(shù)據(jù)。除此之外，如果用戶先進(jìn)行了熱力圖等操作，隨后使用時(shí)間軸改變時(shí)間，則會(huì)因?yàn)閿?shù)據(jù)的改變從而使熱力圖也動(dòng)態(tài)改變。

3) 搜索功能模塊。由搜索建議和定位到目標(biāo)組成。搜索建議：當(dāng)用戶在搜索框中鍵入少量的字符串或文字時(shí)，根據(jù)用戶鍵入的信息提供現(xiàn)有船名以列表的形式供用戶選擇。定位到目標(biāo)：當(dāng)用戶點(diǎn)擊搜索時(shí)根據(jù)用戶選擇的結(jié)果將地圖縮放到對(duì)應(yīng)目標(biāo)。

4) 熱力圖模塊。熱力圖使用百度地圖開(kāi)源庫(kù)“熱力圖庫(kù)”來(lái)實(shí)現(xiàn)，其基于HTML5新特性canvas?；驹硎牵簽槊總€(gè)離散點(diǎn)創(chuàng)建mask(一個(gè)圓形區(qū)域)，mask的半徑表示該點(diǎn)影響的范圍，半徑可取區(qū)間(1～10米)。為中心點(diǎn)賦予權(quán)重1，從中心點(diǎn)沿半徑向外按某種規(guī)律(線性、二次曲線)減小，邊緣區(qū)域權(quán)重為0。最終為每個(gè)離散點(diǎn)創(chuàng)建mask，如果有重疊區(qū)域則將該重疊區(qū)域的權(quán)重累加。權(quán)重越高，該區(qū)域越密集，表現(xiàn)在圖像上就越亮。流程圖如圖4所示。

圖4 熱力圖流程圖

熱力圖直觀反映了船舶集中分布的情況，發(fā)現(xiàn)“冷區(qū)”與“熱區(qū)”，從而針對(duì)不同地區(qū)采取不同措施提升航道安全。繪制熱力圖需要用到的數(shù)據(jù)有經(jīng)度、緯度、權(quán)重(均為1)，用戶點(diǎn)擊熱力圖功能后會(huì)清空當(dāng)前地圖上的信息并向服務(wù)器請(qǐng)求數(shù)據(jù)。服務(wù)器返回?cái)?shù)據(jù)后通過(guò)構(gòu)造數(shù)據(jù)使其變成百度熱力圖庫(kù)支持的數(shù)據(jù)類型后通過(guò)heatmapOverlay.setDataSet()方法創(chuàng)建熱力圖。如果用戶切換了熱力圖半徑，則會(huì)清除當(dāng)前熱力圖，然后再次請(qǐng)求數(shù)據(jù)并根據(jù)所選半徑進(jìn)行繪制。

5) 軌跡可視化模塊。軌跡可視化展現(xiàn)了當(dāng)天(用戶設(shè)置的時(shí)間)的全部艦船軌跡，軌跡反映了艦船的流向狀態(tài)，顏色越亮的地方表示軌跡越密集。軌跡可視化分為空間和時(shí)間兩個(gè)部分，空間上繪制軌跡效果，時(shí)間上繪制動(dòng)畫效果，其具體流程如圖5所示。軌跡可視化需要獲取艦船軌跡點(diǎn)經(jīng)緯度坐標(biāo)、船名、時(shí)間戳等信息，然后使用AJAX將該時(shí)間發(fā)送給服務(wù)器，服務(wù)器連接數(shù)據(jù)庫(kù)后，以該時(shí)間為條件查詢符合條件的數(shù)據(jù)并返回，前端接收返回?cái)?shù)據(jù)后將數(shù)據(jù)構(gòu)造成為百度大數(shù)據(jù)可視化庫(kù)所支持的數(shù)據(jù)結(jié)構(gòu)，最后通過(guò)mapv.baiduMapLayer()方法實(shí)現(xiàn)。

圖5 軌跡可視化流程圖

6) 軌跡查詢模塊。軌跡查詢可以精確查詢一艘船指定時(shí)間段內(nèi)的軌跡，并計(jì)算出軌跡長(zhǎng)度，具體流程如圖6所示。

圖6 軌跡查詢流程圖

具體過(guò)程如下：用戶確定船名，設(shè)置起始時(shí)間后通過(guò)AJAX發(fā)送至服務(wù)器。服務(wù)器接收后并將其作為查詢條件連接數(shù)據(jù)庫(kù)進(jìn)行查詢，查詢結(jié)果為一系列經(jīng)緯度點(diǎn)(已按時(shí)間進(jìn)行升序排列)，并返回。前端接收處理返回?cái)?shù)據(jù)，使用經(jīng)緯度點(diǎn)坐標(biāo)集通過(guò)polyline折線繪制軌跡線段，計(jì)算軌跡線相鄰兩點(diǎn)間的距離累加后得到整個(gè)軌跡的長(zhǎng)度，最后使用secCenter()方法將地圖縮放至軌跡起點(diǎn)。

7) 統(tǒng)計(jì)分析模塊。統(tǒng)計(jì)分析使用數(shù)據(jù)可視化圖表庫(kù)Echarts，通過(guò)該功能可以直觀地看出有關(guān)艦船的各類信息(船速、吃水深度、長(zhǎng)寬、航向等)。該功能主要體現(xiàn)在多種圖表的應(yīng)用上，具體涉及直方圖、折線圖、扇形圖、雷達(dá)圖的應(yīng)用。不同的圖表有不同的配置項(xiàng)(具體請(qǐng)參閱Echarts開(kāi)發(fā)文檔)，分析每種圖表x軸和y軸分別對(duì)應(yīng)什么數(shù)據(jù)更為合適后就可以對(duì)數(shù)據(jù)進(jìn)行處理了，然后通過(guò)Echarts.setOption()實(shí)現(xiàn)。直方圖的關(guān)鍵在于對(duì)數(shù)據(jù)(船速)的排序工作。船速升序直方圖和吃水深度圖均采用該方法對(duì)數(shù)據(jù)進(jìn)行排序處理。扇形圖需要對(duì)相應(yīng)的頻數(shù)進(jìn)行統(tǒng)計(jì)，雷達(dá)圖則按配置指定數(shù)據(jù)即可。

8) 其他功能。包括設(shè)置地圖樣式和注冊(cè)登錄功能。地圖樣式提供了多種顏色方案，用戶可以隨意進(jìn)行切換從而改變地圖背景顏色。

3 系統(tǒng)實(shí)現(xiàn)

3.1 數(shù)據(jù)庫(kù)建庫(kù)

系統(tǒng)的數(shù)據(jù)庫(kù)由百度地圖數(shù)據(jù)庫(kù)和本地?cái)?shù)據(jù)庫(kù)兩部分組成。前者直接調(diào)用百度地圖API獲取。本地?cái)?shù)據(jù)庫(kù)中數(shù)據(jù)研究采用了 NOAA 國(guó)家氣候數(shù)據(jù)中心網(wǎng)站提供的VOSCLIM 數(shù)據(jù)。最后，將得到的數(shù)據(jù)以db格式導(dǎo)入MQL，數(shù)據(jù)庫(kù)建庫(kù)完成。

3.2 關(guān)鍵技術(shù)

1) AJAX。一種創(chuàng)建交互式網(wǎng)頁(yè)應(yīng)用的網(wǎng)頁(yè)開(kāi)發(fā)技術(shù)。通過(guò)在后臺(tái)與服務(wù)器進(jìn)行少量數(shù)據(jù)交換，AJAX 可以使網(wǎng)頁(yè)實(shí)現(xiàn)異步更新。這意味著可以在不重新加載整個(gè)網(wǎng)頁(yè)的情況下，對(duì)網(wǎng)頁(yè)的某部分進(jìn)行更新[8]。該系統(tǒng)中向服務(wù)器發(fā)出的請(qǐng)求均使用AJAX來(lái)完成。

2) 動(dòng)態(tài)加載(艦船位置可視化)。受數(shù)據(jù)量大、計(jì)算機(jī)性能、內(nèi)存、瀏覽器等多因素的影響，直接在地圖上加載當(dāng)前時(shí)刻的全部數(shù)據(jù)，會(huì)造成系統(tǒng)卡頓和崩潰等情況。結(jié)合實(shí)際，該系統(tǒng)最終采取動(dòng)態(tài)加載的方案，即通過(guò)地圖縮放級(jí)別和地圖可視范圍判斷應(yīng)添加的數(shù)據(jù)類型和數(shù)據(jù)量，從而減輕瀏覽器、服務(wù)器的壓力，保證系統(tǒng)穩(wěn)定高效運(yùn)行。動(dòng)態(tài)加載流程圖如圖7所示。

圖7 動(dòng)態(tài)加載流程圖

(1) 根據(jù)地圖縮放級(jí)別加載。地圖縮放級(jí)別零界為14級(jí)(對(duì)應(yīng)地圖比例尺1 km)?？s放級(jí)別小于14級(jí)：采用的是百度地圖提供的海量點(diǎn)(PointCollection)來(lái)替代marker。海量點(diǎn)和marker的區(qū)別在于，marker除了顯示點(diǎn)的位置還可以為marker添加諸如事件、信息窗口等具體內(nèi)容，而海量點(diǎn)更多的是向用戶提供數(shù)據(jù)點(diǎn)的一種位置關(guān)系，并非具體內(nèi)容，在數(shù)據(jù)較多時(shí)顯然性能要優(yōu)于marker。大于14級(jí)：因比例尺增大，地圖上顯示的內(nèi)容較少、較詳細(xì)，可采用marker，在展示數(shù)據(jù)的同時(shí)為每個(gè)marker添加了具體信息，用戶可以查看其具體內(nèi)容。根據(jù)地圖縮放級(jí)別確定加載何種類型數(shù)據(jù)后大大提升了運(yùn)行效率。

(2) 根據(jù)地圖可視范圍加載。獲得地圖區(qū)域的左下角坐標(biāo)(x1,y1)和地圖區(qū)域的右上角坐標(biāo)(x2,y2)。x1≤x≤x2即為當(dāng)前可視范圍內(nèi)經(jīng)度范圍區(qū)間，y1≤y≤y2即為當(dāng)前可視范圍內(nèi)緯度范圍區(qū)間。向服務(wù)器進(jìn)行數(shù)據(jù)請(qǐng)求時(shí)，使用x1、x2、y1、y2作為查詢條件從數(shù)據(jù)庫(kù)中查詢?cè)摻?jīng)緯度范圍內(nèi)的數(shù)據(jù)實(shí)現(xiàn)動(dòng)態(tài)加載。根據(jù)地圖可視范圍加載當(dāng)前可視區(qū)域內(nèi)的數(shù)據(jù)保證了系統(tǒng)的穩(wěn)定性，減輕了數(shù)據(jù)壓力。

3.3 功能實(shí)現(xiàn)

根據(jù)詳細(xì)設(shè)計(jì)的過(guò)程，通過(guò)HTML、CSS、JavaScript、PHP語(yǔ)言和Web開(kāi)發(fā)平臺(tái)實(shí)現(xiàn)了艦船數(shù)據(jù)顯示、艦船數(shù)據(jù)詳細(xì)信息展示、搜索功能、熱力圖功能、詳細(xì)軌跡查詢功能、艦船各類信息統(tǒng)計(jì)分析功能、軌跡可視化等功能。圖8為系統(tǒng)主界面的運(yùn)行效果，圖9-圖13為各功能模塊運(yùn)行效果。

圖8 系統(tǒng)主界面

圖9 統(tǒng)計(jì)分析

圖10 熱力圖

圖11 軌跡可視化

圖12 船舶詳細(xì)信息

圖13 軌跡查詢結(jié)果

4 結(jié) 語(yǔ)

針對(duì)南海海域復(fù)雜、艦船數(shù)量眾多、艦船信息不直觀等問(wèn)題，利用可視化相關(guān)技術(shù)、圖表技術(shù)，設(shè)計(jì)了南海艦船數(shù)據(jù)可視化與分析系統(tǒng)，達(dá)到了直觀、高效、多角度展現(xiàn)、分析艦船數(shù)據(jù)的目的，對(duì)探索艦船規(guī)律、南海航道安全評(píng)價(jià)起到了參考作用。

南海在我國(guó)有著重要地位，對(duì)南海艦船的研究對(duì)于提升南海安全有積極作用。因?qū)Ａ繑?shù)據(jù)的存儲(chǔ)工作做得還不夠好，僅有百萬(wàn)級(jí)數(shù)據(jù)，并沒(méi)有全部添加(千萬(wàn)級(jí))。另外在軌跡可視化方面還沒(méi)能處理好時(shí)間維長(zhǎng)時(shí)間運(yùn)行導(dǎo)致系統(tǒng)卡頓的問(wèn)題。整個(gè)系統(tǒng)的優(yōu)化工作做得還不夠好，不論是在瀏覽器兼容性還是頁(yè)面布局上都還有待提高。目前，在針對(duì)船舶數(shù)據(jù)分析挖掘的問(wèn)題上，已有學(xué)者[9-15]從多方面進(jìn)行了深入的研究，后續(xù)還可以考慮在該系統(tǒng)中加入軌跡聚類分析、船舶預(yù)警、船舶行為分析等功能，使之更加完善。