這篇心得,主要針對智慧城市數據融合可視化系統的設計實施經驗進行總結,在設計理念、設計方法、技術實現、常見問題等方面,對設計實施經驗進行總結,以方便讀者更好的了解可視化系統的設計實現。
01 明確系統的應用場景
智慧城市數據可視化系統,不同于普通運行于PC端的系統,它的應用場景通常是展示、匯報、會議、應急指揮等,受眾通常是關心數據統計結果以及發展態勢的決策者、管理者。
這一點是非常重要的,只有了解了系統的應用場景、用途、受眾,才能從使用者的角度去進行設計和實現。
02 系統功能結構的規劃
智慧城市的可視化應用中,通常涉及城市管理的多個領域,如:教育、旅游、醫療、交通等等,可以將每個領域作為一個“專題”,每個專題根據內容的多少設計一個或多個數據展示頁面。
在系統的最外層,可以設計一個如上圖照片中的“具備系統主菜單功能的封面”,系統啟動運行后,首先進入這個界面。
進入具體的專題后,可以通過上方TAB風格的菜單來進行各模塊的切換。模塊的切換也可通過側邊隱藏式標簽菜單來實現。
03 系統之間的對接
數據可視化系統是城市運行數據的生動展示方式,在實施過程中,通常需要對接基礎業務系統,從基礎業務系統獲取數據,從而進行數據的可視化展示。
方式1:對于已經實施了ESB總線系統的智慧城市項目,主要通過ESB以WS方式進行數據對接。 方式2:對于第三方系統,主要采用REST的方式進行對接,數據格式為JSON。
在標準版本的智慧城市數據可視化系統中,采用了echarts作為主要的數據可視化組件。
echarts作為國內一款相對較為成功的開源項目,總體上來說有這樣的一些優點:
容易使用,官方文檔比較詳細,而且官網中提供大量的使用示例供大家使用。 支持按需求打包,官網提供了在線構建的工具,可以在線構建項目時,選擇項目所需要使用到的模塊,從而達到減小JS文件的體積。 開源 支持中國地圖功能
對于一些標量數據,主要采用自行設計的label組件來進行顯示。
對于適合一些列表方式表現的數據集合,需要自行設計與總體風格匹配的表格進行顯示。
05 常用圖表及用法
(1)折線圖
適用場景:折線圖適用于二維的大數據集,還適合多個二維數據集的比較。折線圖并不關注具體的數字是多少,也不強調個體的對比,而是從整體宏觀的角度,把握發展的趨勢。
(2)面積圖
適用場景:強調數量隨時間而變化的程度,也可用于引起人們對總值趨勢的注意。
延伸圖表:堆積面積圖、百分比堆積面積圖還可以顯示部分與整體之間(或者幾個數據變量之間)的關系。
(3)柱形圖
適用場景:柱形圖關注各個元素之間的分布情況,強調的是個體之間的對比,突出詳細的數據。 柱狀圖也可看趨勢,但不宜展示一個宏觀的長遠的趨勢,它更適宜展示近期的發展趨勢。
衍生圖表:堆積柱形圖,柱形圖組,條形圖,堆積條形圖等。
注意:為設計美觀,柱形圖之間的間隔設置為1/2寬度為宜。
(4)折線柱形組合圖
適用場景:要求折線圖與柱狀圖之間存在一定的關聯,放在一起更能體現更多的問題,從而實現多組數據統計在一張圖表中的形式。