基于Bezier曲線的航班可視化系統設計

耿倩， 陶禮

(1.陜西工業職業技術學院 信息工程學院， 咸陽 712000; 2.西北工業大學 機電學院， 西安 710072; 3.陜西省機電傳動與控制工程實驗室 傳動中心， 西安 710072)

0 引言

在大數據時代,我們身邊充斥著各類信息,各種數據,人們的時間被打碎,注意力被分散,更多的人喜歡看圖片而非文字,喜歡看圖表而非數據。數據可視化就是利用電腦圖形的理論和電腦圖像的處理手段, 把一些圖標、地圖、網頁等以及其他種類的能夠使數據的內容變得更容易理解的一種表達方式來表達數據, 這樣就能使得數據更容易被接受[1]。傳統的圖表統計工具存在交互性差、擴展性低、操作復雜、性能受限、可展示的圖表種類不夠豐富等問題。相比于傳統圖表與數據儀表盤,如今的數據可視化致力于用更生動、友好的形式,即時呈現隱藏在瞬息萬變且龐雜數據背后的業務洞察。通過專門的努力, 研究人員、學者和實踐者已經開發出可視化的理論、技術、軟件工具和應用程序, 它們可以用于各種各樣的目的, 并且可以以一種引人注目的方式面向目標受眾[2]。本論文所描述的航班數據可視化系統可以讓非專業人員便捷、直觀、高效的統計分析出所需的航班數據。

1 航班可視化系統的總體設計

三次工業革命給人們的出行方式帶來了極大的改變，誕生于第一次工業革命中的飛機在后來的機械工業和現代計算機技術的加持下，已經成為當前世界上最安全的交通工具。但是，由于飛機出行受天氣影響較大，或中國目前民航可用空域較少，部分航線過于繁忙;導致航班時常晚點或延誤甚至取消。航班統計應完善數據收集方法, 加強信息化建設,盡量客觀準確快速的反應航班整體運行情況, 為改進提供強力的支持, 為我國航班保障與管理助力[3-4]。本系統通過抓取全球航班在過去3個月的航行記錄，編程實現航班/航線可視化，并通過交互實現點選，實現篩選、高亮等功能，例如高亮所有國內航班/航線、高亮所有中美航班/航線、高亮某一天上午從北京出發的所有延誤或取消的航班等。結合機場的地理信息，還可以機場、城市、省、地區、國家等粒度進行聚合。進一步的，可以分析展示航線繁忙程度、航班準點率等。

開發航班可視化系統的目的是為用戶提供一個數據查詢與分析平臺，因此，系統的最基本的功能是能夠按照用戶的條件查詢出航班，然后計算出該航線的延誤率、準點率、平均延誤時間等，進一步的，可以分析展示航線繁忙程度。根據以上分析，本項目需要具備的功能如圖1所示。

圖1 功能需求分析圖

具體如下：(1)航班查詢:根據用戶的選擇模糊或精確的查詢所需航班并繪制其航線在地圖上。

(2)航班篩選:根據用戶的篩選模式和篩選條件進行高亮/顯示/隱藏所要展示的航班航線。

(3)航班信息展示:當用戶在地圖上點擊某個航班航線之后，顯示該航班的詳細信息：包括起飛機場/城市/國家、經停機場/城市/國家、目標機場/城市/國家、計劃起飛時間、計劃到達時間。

(4)航班歷史信息展示:該航班過去3個月的歷史信息與狀態。

(5)出入港信息統計:某城市或機場的出入港統計。

2 航班可視化系統中的數據采集與清理

網絡爬蟲，是一種通過既定規則，自動地抓取網頁信息的計算機程序。爬蟲的目的在于將目網頁數據下載到本地，以便進行后續的數據分析與處理[5]。爬蟲系統的興起源于海量的網絡數據的可用性，通過爬蟲技術，能夠較為容易的獲取網絡數據，并通過數據的處理，得出有價值的數據，通過數據分析，得到有價值的結論[6]。

2.1 數據源網站分析

隨著Internet技術的不斷發展，互聯網已經成為人們獲取信息的主要途徑，搜索引擎從互聯網中靶向性篩選出有用的信息[7]，而網絡爬蟲又是搜索引擎的基本構件之一。為了完成航班可視化系統,筆者爬取了FlightAware網站上的相關信息。

FlightAware是全世界最大的航班跟蹤數據公司，為超過10 000家飛機運營商和服務商以及超過12 000 000名乘客提供全球航班跟蹤解決方案。FlightAware使用來自超過55個國家的空中交通管制系統、分布于超過175個國家的FlightAware ADS-B地面站網絡以及Aireon天基全球ADS-B的數據，支持各大供應商的全球數據鏈路(衛星/VHF)，包括ARINC、SITA、Satcom Direct、Garmin、Honeywell GDC和UVdatalink。

為了實現相關的功能，需要爬取歷史航班信息來實現航班可視化，可以有效的幫助用戶及時了解每個航班的信息，服務人群，使之出行選擇權更廣泛，節省不必要的時間浪費。

2.2 爬蟲程序設計與實現

首先利用谷歌瀏覽器自帶的開發者工具中的Network解析器工具來解析網頁的文本信息，分析網頁HTML文本信息和頁面規則后，編寫python程序來完成以下步驟來實現抓取目標數據[8]。

(1)通過分析得出相應的規則，并使用正則表達式來實現獲取數據。

(2)將獲取的數據利用for循環得到相應的排版。

(3)將整理后的數據通過read_csv函數存放到指定文件夾下。

在對航班數據處理時用到了python中的數據分析包pandas中的read_csv、read_excel、to_datatime、pd函數以及數據分析包time和數據分析包os。在拿到大量的原始數據的時候，因為有少量的文件不支持批量等操作，因此需要做一些簡單的去空、去除操作[9]。再將篩選后的數據文件保存在一個文件夾中，利用python程序批量處理文件。最終數據處理后的樣式非常的美觀，即方便數據的調用與數據的存儲。處理后的數據片段如圖2所示。

圖2 數據處理結束后的樣式

3 航班可視化系統的技術實現

3.1 航班可視化系統的總體設計

動態交互式可視化技術越來越受到廣大研究者和用戶的關注。動態交互可視化通過用戶、界面和網絡的交互過程，彌補了靜態可視化的靈活性不足、視覺分析薄弱、視圖呈現不完整等不足[10]。數據可視化工具很多,如Datawrapper等工具,這類工具實現了系統平臺內已有的可視化效果,缺乏擴展性;還有一些是為數據可視化提供庫函數的開發工具,如Raphael、Echarts等可視化函數庫,這類工具為用戶提供了各種可視化實現接口,但是需要用戶搭建可視化平臺,缺乏易用性。D3.js是基于SVG語言開發的庫文件，全名是Data-Driver-Document，換句話說就是一種基于數據驅動的文檔，擁有高拓展性和高兼容性，是一個可操作的DOM節點[11]，能將數據轉換成圖形的可視化工具，D3將強大的可視化，動態交互和基于數據驅動的DOM操作方法完美地結合在一起[12]，可以使用D3設計效果更好，交互性更好的可視化界面。

本系統采用MVC架構，每次從index.php作為程序入口，通過參數c和參數a，執行對應的的控制器和對應的方法,如圖3所示。

圖3 請求流程圖

本系統的交互邏輯簡潔明了，如圖4所示。

圖4 交互邏輯圖

當用戶進入首頁后，系統自動繪制底圖以及世界主要的城市坐標，然后用戶可以根據條件或快速查詢出所需航班，并且系統會在底圖上繪制航線。如果需要進一步篩選，用戶可通過篩選實現高亮顯示或只顯示符合要求的數據，進一步的可以查看該航班的詳細信息，如準點率、延誤率、機場/城市出入港統計、機型統計、航班信息、經停信息、航空公司等。

3.2 航班可視化系統的詳細設計

數據可視化系統中的航線采用曲線連接，直線連接雖然簡單，但是從客觀上違背了航線的物理軌跡；并且當兩個目地址之間有多個航班時，使用直線直接連接必然會造成多個航線重疊，影響作品的交互性[13]；于是，本作品中采用生成較為平滑的Bezier曲線連接兩個目的地，形成大致航線；這樣雖然不能精確的表示出航線的實際軌跡，但是遵從了航線不是直線的客觀事實；更重要的是，當出現兩個目的地之間有多個航班時，使用曲線可以很好的避免重疊的問題，增強交互性能。

首先，系統中大量用到的直連式曲線，是通過d3.js將始發地機場經緯坐標和目的機場經緯坐標映射成svg畫布的坐標，因為svg坐標的坐標原點在頁面左上角，不利于坐標之間的計算，于是系統中將svg坐標轉換成以頁面左下角為坐標原點，類似于數學中的坐標系。轉換方法也很簡單,svg和數學中的坐標x坐標是一樣的，因此只需要轉換y軸坐標就可以了，同樣也可以逆向轉換,如圖5所示。

圖5 坐標轉換代碼

系統中采用二次Bezier曲線來繪制航線曲線，二次Bezier曲線簡單的來說主要有由三個點構成，一個起始點、一個結束點、還有一個控制點[14]；因此，本算法的關鍵在于計算出該曲線的控制點即可，如圖6所示。

詳細計算方法如下。

(1)坐標轉換完成之后，就可以使用數學中的坐標公司進行相應的計算了[15]，先假設始發地機場經緯坐標通過d3.js地圖映射后轉換成svg的坐標，再轉換成以頁面左下角為坐標原點的坐標為A(x1,y1) 目的地機場為B(x2,y2)。

(2)計算A,B兩點連線的直線斜率k,以及直線偏移量b,直線方程為y1=k1*x+b

圖6 曲線控制點計算示意圖

(3)計算A,B兩點連線的兩個三等分點坐標M(xm1,xm2),N(xn1,xn2)點M距離A點較近，點N距離B點較近。

(4)隨機生成一個數Px (xm1< Px < xn1),因為點在線上，所以Py = k1*Px+b ，則P(px,py)。

(5)設與直線y1垂直的直線為y2,則y2=k2*x+b. 直線y2過P點

(6)在直線y2上與P點距離為L的點有兩個分別為C1(cx1,cy1),C2(cx2,cy2)

(7)最后，求出以P為圓心，L為半徑的圓的一般方程，該圓一定與直線y2有兩個交點，本作品隨即取用其中一個作為曲線控制點

(8)L值的確定使用d3.js的尺度函數，根據A,B兩點之間的距離，生成L,兩點之間的距離越大，L越大；兩點之間的距離越小，L就越小。

航班數據可視化系統中航班統計是指當鼠標點擊航線時，通過ajax將航班號發送到php后端，php調取數據庫中該航班的所有歷史信息，分別計算出航班出發和到達時的延誤率、準點率、提前率。以及起飛時平均延誤時長、降落時平均延誤時長和平均飛行時長以及機型統計，計算完成后將結果以json的形式返回，json格式如圖7所示。

解析json數據后，頁面底部彈出統計面板通過d3.js的餅圖生成器，生成餅圖顯示航班的延誤率、準點率、機型統計圖，如圖8所示。

圖7 查詢某航班詳情與統計信息

圖8 查詢航班詳情

4 總結

本文先從網絡爬蟲獲取航班信息，然后使用MVC架構詳細設計了航班可視化系統，其中數據的可視化效果使用二次Bezier曲線繪制航線曲線，使用D3.JS技術來進行航班具體數據的信息繪制。運用大數據技術來實現航班數據的展示，具有一定的應用價值。