張慧明，姜秀杰，陳志敏

（1.中國科學(xué)院 空間科學(xué)與應(yīng)用研究中心，北京 100190；2.中國科學(xué)院大學(xué) 北京 100049）

基于web技術(shù)的探空火箭試驗任務(wù)可視化設(shè)計

張慧明1，2，姜秀杰1，陳志敏1

（1.中國科學(xué)院 空間科學(xué)與應(yīng)用研究中心，北京 100190；2.中國科學(xué)院大學(xué) 北京 100049）

為了幫助科研人員理解探空火箭試驗任務(wù)中獲取的抽象數(shù)據(jù)，直觀地了解火箭的飛行狀況，本文利用SketchUP創(chuàng)建火箭模型，采用Google Earth瀏覽器插件作為開發(fā)平臺，利用Google Earth API驅(qū)動火箭模型，直觀生動地表達了火箭的姿態(tài)、彈道數(shù)據(jù)。系統(tǒng)采用B/S架構(gòu)，利用WebSocket前端技術(shù)實現(xiàn)了遙測站到web頁面的數(shù)據(jù)傳輸，解決了傳統(tǒng)實時web應(yīng)用網(wǎng)絡(luò)實際利用率低下的問題。實驗結(jié)果表明系統(tǒng)開發(fā)部署的成本較低，系統(tǒng)構(gòu)建的火箭發(fā)射場景更為逼真，再現(xiàn)火箭飛行狀態(tài)的準(zhǔn)確性和實時性較好。

探空火箭；可視化；彈道；姿態(tài)

探空火箭是一種在近地空間進行探測和科學(xué)試驗的火箭，其飛行高度介于探空氣球與衛(wèi)星之間，是臨近空間40～300 km唯一的、其他飛行器所不能及的實地探測手段[1]。以探空火箭作為載體而開展的各項空間環(huán)境原位探測任務(wù)對幫助人們理解臨近空間大氣環(huán)境有重要意義。

可視化（Visualization in Scientific Computing，VISC ）是90年代計算機應(yīng)用的一個重要領(lǐng)域，它以圖形、圖像來描述物理現(xiàn)象，可理解為處理計算或?qū)崪y數(shù)據(jù)的一種方法[2]?？梢暬诤教祛I(lǐng)域中的運用已經(jīng)非常廣泛。火箭下傳的抽象數(shù)據(jù)閱讀困難，難以被人接受和理解，并且難以識別數(shù)據(jù)中的粗大點，使用可視化技術(shù)將它們表達成3維模型則更加直觀逼真[3]?？梢暬到y(tǒng)可以幫助地面人員準(zhǔn)確地了解火箭的飛行狀態(tài)，對航天任務(wù)的順利實施有重要意義。

傳統(tǒng)構(gòu)建探空火箭任務(wù)可視化系統(tǒng)的方法從底層OpenGL和Direct3D等圖形接口著手搭建系統(tǒng)[4]。這種開發(fā)方式的一個很大的缺點是程序員需要關(guān)注大量計算機圖形學(xué)的細節(jié)問題，不能專注于航天任務(wù)本身。利用專業(yè)的可視化仿真平臺進行開發(fā)能顯著減少重復(fù)勞動。這些平臺主要有：AGI的SKT、NASA的WorldWind和Google Earth。這些平臺功能強大，他們?yōu)槌绦騿T提供了二次開發(fā)的接口，對程序員屏蔽底層圖形實現(xiàn)細節(jié)從而使程序員更加專注于航天任務(wù)本身。但是STK對我國禁運，其內(nèi)置的安全模塊使得二次開發(fā)需要對STK進行破解，盡管破解可能實現(xiàn)，在部署環(huán)節(jié)依然需要STK安全模塊的許可，這意味著需要在部署的計算機上重新安裝并破解STK，這給軟件的部署和維護帶來很大的麻煩。WorldWind雖然是開源的，但也不可避免的繼承了開源軟件的一些缺點：如用戶體驗關(guān)心不夠，系統(tǒng)非黑箱所帶來的開發(fā)維護成本高?？偟膩碚f以上兩種開發(fā)方式采用C/S模型，用一種強類型的靜態(tài)語言開發(fā)，如java、C#等，雖然功能強大，但是研制周期較長而且部署和更新較困難。而可視化的需求是豐富多變的，這就需要使用一種更方便快捷的方式開來開發(fā)可視化系統(tǒng)。

Google Earth瀏覽器插件不但提供覆蓋全球的衛(wèi)星圖像、地圖、地形、3D建筑而且具備良好的用戶體驗和高效的渲染引擎。Google Earth JavaScript API提供了功能完備二次開發(fā)能力[5-6]。JavaScript作為一種弱類型的動態(tài)語言其靈活性可以更好的適應(yīng)每次航天任務(wù)的需求更改，同時高效的Chrome V8 JavaScrpt引擎使得javacript腳本語言在執(zhí)行效率可以媲美編譯型語言。

在這樣的背景下本文利用Google Earth 瀏覽器插件這一免費的開發(fā)平臺實現(xiàn)網(wǎng)頁的三維場景實時渲染。系統(tǒng)采用B/S架構(gòu)，將數(shù)據(jù)的顯示和數(shù)據(jù)的處理分離，期望得到更好的可擴展性。系統(tǒng)的設(shè)計目標(biāo)是具備web應(yīng)用在部署和更新方面的優(yōu)勢，又具備客戶端應(yīng)用在交互性和高性能的方面的優(yōu)勢。

1 系統(tǒng)總體設(shè)計

為了和已有的遙測系統(tǒng)兼容，可視化系統(tǒng)采用B/S架構(gòu)，主要分為web前端和websocket服務(wù)器，websocket服務(wù)器接收預(yù)處理服務(wù)器傳來的火箭下行數(shù)據(jù)，對數(shù)據(jù)進行解碼和重采樣后存入發(fā)送緩存。Web頁面和模型文件等資源都存儲在http資源服務(wù)器中，用戶向資源服務(wù)器請求頁面，頁面加載完成后向websocket服務(wù)器注冊并請求火箭數(shù)據(jù)，這樣設(shè)計的優(yōu)點是將數(shù)據(jù)的顯示和數(shù)據(jù)的處理分離，服務(wù)器負責(zé)所有CPU密集型的計算任務(wù)，客戶端負責(zé)數(shù)據(jù)表現(xiàn)方式。

websocket服務(wù)器是系統(tǒng)的核心。它不但保持與后端數(shù)據(jù)源的通信，接收并處理原始數(shù)據(jù)，而且向所有注冊的前端用戶廣播處理后的數(shù)據(jù)。在文中預(yù)處理服務(wù)器和各個遙測站屬于現(xiàn)有系統(tǒng)，其余部分是擴展的系統(tǒng)。各級系統(tǒng)的網(wǎng)絡(luò)關(guān)系圖如圖1所示。

圖1 系統(tǒng)網(wǎng)絡(luò)結(jié)構(gòu)Fig.1 Systems network architecture

WebSocket 協(xié)議是實時的關(guān)鍵。WebSocket 設(shè)計出來的目的就是要取代輪詢和 Comet 技術(shù)，使客戶端瀏覽器具備像 C/S 架構(gòu)下桌面系統(tǒng)的實時通訊能力。所以WebSocket有“Web TCP”之稱。傳統(tǒng)的輪詢或是Comet 技術(shù)本質(zhì)上是不斷查詢客戶端數(shù)據(jù)是否更新。WebSocket 連接本質(zhì)上就是一個 TCP 連接，所以在數(shù)據(jù)傳輸?shù)姆€(wěn)定性和數(shù)據(jù)傳輸量的大小方面，和輪詢以及 Comet 技術(shù)比較，具有很大的性能優(yōu)勢。Websocket.org 網(wǎng)站對傳統(tǒng)的輪詢方式和 WebSocket 調(diào)用方式作了一個詳細的測試和比較，將一個簡單的 Web 應(yīng)用分別用輪詢方式和 WebSocket方式來實現(xiàn)，測試結(jié)果圖如圖2所示。

不難發(fā)現(xiàn)對于相同的應(yīng)用只有websocket占用較小的網(wǎng)絡(luò)帶寬，這在向許多客戶端發(fā)送數(shù)據(jù)時可以節(jié)省大量的網(wǎng)絡(luò)資源從而降低數(shù)據(jù)傳輸?shù)难舆t。

圖2 輪詢和 WebSocket 實現(xiàn)方式的性能對比圖Fig.2 Performance comparison chart of WebSocket and Polling

2 前端系統(tǒng)設(shè)計

2.1 前端系統(tǒng)初始化

前端系統(tǒng)初始化的步驟分為：1）用戶向資源服務(wù)器請求前端頁面，2）頁面加載完畢后初始化Google Earth（GE）插件，3）初始化網(wǎng)絡(luò)控制器和場景渲染控制器。系統(tǒng)初始化序列圖如圖3所示。前端初始化完成后進入就緒狀態(tài)，準(zhǔn)備接收數(shù)據(jù)。

圖3 系統(tǒng)初始化序列圖Fig.3 System Initialization Sequence Diagram

頁面執(zhí)行g(shù)oogle.load（"earth"，"1"）會加載google命名空間，利用該命名空間中的earth對象的createInstance（）方法即可在指定DIV標(biāo)簽處創(chuàng)建google earth 插件實例。插件創(chuàng)建完畢后首先加載模型文件，加載完畢后利用GE.getFeatures（）.appendChild（）方法將模型加入到場景圖中。隨后初始化網(wǎng)絡(luò)控制器（NetManage）和渲染控制器（Player）。NetManage管理接收緩存，Player讀取接收緩存內(nèi)的數(shù)據(jù)并驅(qū)動google earth場景。這兩部分的初始化和運行邏輯在2.2和2.3節(jié)單獨說明。

2.2 前端數(shù)據(jù)接收

在NetManage的初始化過程中要先和服務(wù)器進行信息配置。流程圖如圖4所示。前端和服務(wù)器建立websocket連接后首先向服務(wù)器發(fā)送（CONFIGURABLE）請求配置標(biāo)志，服務(wù)器在接到該請求后回送數(shù)據(jù)采樣頻率，數(shù)據(jù)格式等配置信息。如果客戶端能理解這些信息那么根據(jù)這些信息對Player和緩沖區(qū)進行設(shè)置并向服務(wù)器發(fā)送準(zhǔn)備接收（ACCEPTABLE）標(biāo)志，表示已經(jīng)準(zhǔn)備就緒可以開始發(fā)送數(shù)據(jù)。服務(wù)器會在收到ACCEPTABLE標(biāo)記后將其加入廣播組中并開始發(fā)送數(shù)據(jù)。前端配置和接收流程如圖4所示。

圖4 NetManage運行流程圖Fig.4 Flowchart of NetManage

NetManage封裝了Websocket API。Websocket API的接口十分簡單，用'ws：//'+ip+'：'+port+'/'字符串作為構(gòu)造函數(shù)的參數(shù)，然后只需要覆蓋WebSocket對象的onopen、onmessage、onerror、onclose 4個函數(shù)即可。服務(wù)器返回的配置信息的格式為：采樣頻率，數(shù)據(jù)包總字段數(shù)，字段1名稱，字段2名稱，……，字段N名稱。客戶端在接收到配置信息后就知道以后傳來的數(shù)據(jù)包內(nèi)的字段的相對位置，這樣就可以很輕松的提取數(shù)據(jù)包中的各個字段數(shù)據(jù)了。

網(wǎng)絡(luò)控制器在配置完成后即進入監(jiān)聽狀態(tài)，當(dāng)有新數(shù)據(jù)到達時先提取數(shù)據(jù)再加入接收緩存隊列的末尾，隊列的每一項數(shù)據(jù)是這樣一個5元組：[時間碼，[火箭經(jīng)緯度]，[火箭姿態(tài)]，事件標(biāo)志位，附加信息]。

2.3 三維場景渲染

渲染控制器周期性的從接收緩存隊列的頭部取數(shù)據(jù)，用這些數(shù)據(jù)更新火箭的經(jīng)緯度和姿態(tài)角。更新的周期和配置階段接收到的數(shù)據(jù)采樣頻率一致，這樣可以保證場景和數(shù)據(jù)的一致性。例如配置階段獲得的數(shù)據(jù)采樣頻率是40 Hz那么設(shè)置更新函數(shù)的執(zhí)行頻率也為40 Hz。更新函數(shù)流程圖如圖5所示?？梢钥闯龊瘮?shù)周期性地嘗試更新火箭的當(dāng)前彈道和姿態(tài)，如果沒有數(shù)據(jù)可供更新，則保持原有的彈道姿態(tài)數(shù)值。最后利用google.earth.addEventListener（）函數(shù)將更新提交給場景。方法是將提交函數(shù)注冊到freamend事件中，google eartth引擎會在每幀動畫繪制完成后調(diào)用該函數(shù)。在這個函數(shù)中將火箭的最新狀態(tài)提交給場景圖，并控制攝像機視角跟隨火箭移動。

3 服務(wù)器端系統(tǒng)設(shè)計

Websocket服務(wù)器采用Eclipse RCP框架實現(xiàn)，利用OSGI的插件機制可以方便地對服務(wù)器功能進行擴充。用JavaWebSocket開源庫實現(xiàn)websocket服務(wù)器功能，底層http協(xié)議到websocket協(xié)議的轉(zhuǎn)換工作已經(jīng)由WebSocketServer類完成。只要覆蓋WebSocketServer類的onOpen（），onMessage（），onError（），onClose（）函數(shù)來實現(xiàn)所需功能即可。

圖5 更新火箭飛行狀態(tài)流程圖Fig.5 Flowchart of updating rocket flight status

服務(wù)器運行需要2個緩沖區(qū)和3個線程：發(fā)送緩沖區(qū)和接收緩沖區(qū)；發(fā)送線程、接收線程和處理線程。接收線程在接收到火箭下傳數(shù)據(jù)后存入接收緩沖區(qū)。后臺處理線程專門從接收緩存取數(shù)據(jù)、解碼、封裝成前端接收格式然后存入發(fā)送緩存中。發(fā)送線程從發(fā)送緩沖區(qū)中取數(shù)據(jù)向前端發(fā)送，發(fā)送流程圖如圖6所示，當(dāng)沒有客戶端時發(fā)送線程會阻塞直到新客戶加入才會被喚醒，當(dāng)發(fā)送緩存沒有數(shù)據(jù)可用時也會阻塞直到有新的可用數(shù)據(jù)才會被喚醒。緩沖區(qū)采用同步隊列BlockingQueue實現(xiàn)。作為接收端，服務(wù)器接收來自遙測站的數(shù)據(jù)格式符合CCSDS標(biāo)準(zhǔn)。作為發(fā)送端，發(fā)送的數(shù)據(jù)格式是要符合配置階段雙方約定好的字段順序，各個字段用逗號分隔，方便前端對字段的提取。

火箭下傳數(shù)據(jù)的采樣頻率是根據(jù)設(shè)備需求制定的，往往不適合可視化。例如姿態(tài)儀的原始采樣頻率是200 Hz，但是前端沒有能力也沒有必要每秒渲染200幀，考慮到人眼對每秒24幀的渲染速度就無明顯卡頓現(xiàn)象，所以可以在服務(wù)端對原始數(shù)據(jù)進行重采樣，挑選適量且具有代表性的數(shù)據(jù)進行發(fā)送，這樣既減少了網(wǎng)絡(luò)負載也減少了前端內(nèi)存消耗。對于彈道和姿態(tài)這樣的數(shù)據(jù)來說一般不會有較大的突變，重采樣算法重視轉(zhuǎn)折點和拐點，濾除多余的數(shù)據(jù)。一般下采樣到40 Hz頻率即可滿足可視化需求。這樣既減少了數(shù)據(jù)傳輸量也保證了顯示質(zhì)量。

圖6 發(fā)送線程流程圖Fig.6 Flow chart of dispatch thread

4 結(jié) 論

系統(tǒng)采用MVC[7]設(shè)計思想將數(shù)據(jù)的處理和數(shù)據(jù)的顯示分離開來，提高了系統(tǒng)的擴展性和可維護性。利用Google Earth插件作為開發(fā)平臺，降低了開發(fā)成本，豐富了用戶體驗。利用websocket技術(shù)提高了網(wǎng)絡(luò)利用率和數(shù)據(jù)傳輸效率。實際的演示結(jié)果表明系統(tǒng)在重現(xiàn)火箭彈道和姿態(tài)有較好的準(zhǔn)確性和可靠性。

[1] 姜秀杰，劉波，于世強，等.探空火箭的發(fā)展現(xiàn)狀與趨勢[J].科技導(dǎo)報，2009，27（23）：101-110.

JIANG Xiu-jie，LIU Bo，YU Shi-qiang，et al.Development status and trend of sounding rocket[J].Science ＆ Technology Review，2009，27（23）：101-110.

[2] 劉維，韓潮.基于Open Inventor的航天可視化系統(tǒng)[J].計算機仿真，2006，23（11）：23-27.

LIU Wei，HAN Chao.A visual aerospace simulation system based on open inventor[J].Computer Simulation，2006，23（11）：23-27.

[3] 胡厚連.淺談空間可視化的發(fā)展與應(yīng)用[J].測繪與空間地理信息，2005，28（2）：79-80.HU Hou-lian Realization and application of spatial visualization[J].Geomatics ＆ Spatial Information Technology 2005，28（2）：79-80.

[4] 李婷婷，劉成，姜秀杰，等.探空火箭可視化設(shè)計[J].計算機仿真，2013，30（6）：46-51.

LI Ting-ting，LIU Cheng，JIANG Xiu-jie，et al.Visualization design for sounding rocket task based on direct 3D[J].Computer Simulation，2013，30（6）：46-51.

[5] 唐勇，劉昌中，吳宏剛.基于Google Earth 的三維航跡監(jiān)視及六自由度飛行仿真[J].計算機應(yīng)用，2009，29（12）：3385-3387.

TANG Yong，LIU Chang-zhong，WU Hong-gang.3D flight track and 6-DOF flight simulation based on Google Earth[J].Computer Application，2009，29（12）：3385-3387.

[6] 江寬，龔小鵬.Google API開發(fā)詳解：Google Maps 與Google Earth雙劍合璧[M ].北京：電子工業(yè)出版社，2008.

[7] 王俊芳，李隱峰，王池.基于MVC模式的ThinkPHP框架研究[J].電子科技，2014（4）：151-153，158.

WANG Jun-fang，LI Yin-feng，WANG Chi.Research of ThinkPHP frame based on MVC model[J].Electronic Science and Technology，2014（4）：151-153，158.

A design for sounding rocket visualization system based on web technology

ZHANG Hui-ming1，2，JIANG Xiu-jie1，CHENG Zhi-ming1
（1.Center for Space Science and Applied Research，Chinese Academy of Sciences，Beijing 100190，China；2.Graduate University of Chinese Academy of Sciences，Beijing 100049，China）

In order to assist Researchers understand the abstract data acquired from the sounding rocket task and know about the flight situation，we model rocket by SketchUP and control the rocket model by Google Earth API.System intuitively expressed rocket ballistic trajectory and attitude in flight.We use WebSocket to transmission data between telemetry station and web page，solved the low network utilization problems of traditional web application.The experimental results show that system development and deployment has a lower cost.System reappear flight situation of sounding has better accuracy and timeliness with a more realistic scenario.

sounding rocket；visualization；ballistic trajectory；attitude

TN91

A

1674-6236（2014）11-0141-04

2014-03-27 稿件編號：201403300

國家高技術(shù)研究發(fā)展計劃資助（Y28021A220）

張慧明（1989—），男，浙江衢州人，碩士研究生。研究方向：計算機可視化與人工智能。