隨著工業4.0變革的推進，逐步開始走向了利用信息化技術促進產業變革的時代，也就是智能化時代。伴隨著時代的走向，工業互聯網和5G網絡逐漸揭開了帷幕，數據不再是單純的數據信息源，數據可以結合一些可視化界面作為載體，實時地展示反饋出這個世界的變化。在諸多行業上，我們可以通過對數據的管控達到場景設備的維護效果，例如智慧園區、智慧工業、智慧礦山的建設，水務系統的監控以及一些公共設施風力發電，數據中心可視化系統等等的搭建上，都可以通過可視化的搭載，進行數據的展示和維控。

布局功能一直是數據可視化大屏的重要功能點之一，舒適的布局界面，可以使人擁有煥然一新的感覺，擁有響應式（自適應）布局的話，可以兼顧各種比例大小下的屏幕，不會因為比例的變化而使得整體的排版錯亂。布局功能不僅適用于大屏的整體排版上，在三維場景數據可視化系統搭配的左右系統數據面板上，依然可以使用 2/3D 融合嵌套的形式完成，而在面板的排列上也可以使用 響應式（自適應）布局，可以將搭載的數據充分地顯示出來。

主題風格的實現，是建立在 HT 特有的圖紙設計機制下，在數據可視化系統實施的過程中，可以應用于各種屏幕的分辨率下。比如系統設計過程中，可以在個人電腦的顯示器下進行圖紙的設計和程序代碼的調試開發，而當開發階段完成后，在現場大屏的布置搭建或者在用戶展示的時候，不用去擔心關于分辨率的變化會出現的失真模糊的問題，從而在項目的開發和搭建上，用戶的使用相對地會簡單很多。加上 HT 自身研發的開發插件 API 也同樣地易于上手，可以實現解決許多行業上的數據可視化系統的應用。

數據可視化技術的基本思想，是將數據庫中每一個數據項作為單個圖元元素表示，大量的數據集構成數據圖像，同時將數據的各個屬性值以多維數據的形式表示，可以從不同的維度觀察數據，從而對數據進行更深入的觀察和分析。經研究表明，人類大腦對視覺信息的處理優于對文本的處理。因此，數據可視化是使用圖表、圖形和設計元素把數據進行可視化，把相對復雜、抽象的數據通過可視的方式以人們更易理解的形式展示出來的一系列手段。數據可視化可以使人們更有效率的完成某些任務，我們可以理解為三點優勢：

>美觀展示:用數據展示企業特色，大會展臺，媒體現場展示等

>數據驅動：實時查看業務概況、監控預警、驅動內部快速響應

>發掘價值：可視化數據呈現后，帶來的視覺感受會幫助人發現新的因素

在圖撲軟件（Hightopo）技術支持下，數據可視化除了“可視”，還有可交流、可互動的特點。設計帶來的不僅是瞬息處理海量數據搭配酷炫的可視化樣式所引起的視覺震撼，更應注重為業務需求服務，設計出符合不同行業需求的個性定制可視化，利于企業做出正確的商業決策，以有根據的數據呈現而幫助企業進行更科學的判斷而避免決策的失誤。

1. 從業務需求分定優先級，關鍵指標是一些概括性詞語，是對一組或者一系列數據的統稱。通過規定主，次，輔，三個指標的關鍵詞來概念性的清晰大屏的主要展示內容，例如我們做的一個照明的監測項目，我們可以歸類成這三種：

>主：主要指標位于屏幕中央，為地圖展現照明區域使用數據。

>次：次要指標位于屏幕兩側以圖表的形式展現。

>輔：主要指標的補充信息鼠標點擊或懸停展示以及交互動效展示。

這樣就可以方便在腦海中確定大屏的整體構架，以便于我們接下來的細化。

2. 通過指標分析維度確立可視化圖表類型

同一個指標的數據，從不同維度分析就有不同結果。如果分析的維度沒有找準或定義的比較混亂，就會使可視化圖表無法清晰的看清楚含義，使人困惑。這里我們引用 Stephen Few 的文章 《Visual Business Intelligence》的四項維度-比較，聯系，分布，構成，來分析數據的邏輯性。

3.根據大屏尺寸，規劃頁面布局，確立交互稿

確立圖表類型后，下一步要進入到布局具體的信息位置，確立交互稿的步驟。確立交互稿的第一步就是要確定大屏的尺寸。客戶的大屏尺寸不用會影響到整體的布局和效果，設計的時候也要考慮下是否有拼接大屏接縫的問題，盡量以拼接屏尺寸來確立柵格化布局。

尺寸確立后，接下來要對設計稿進行布局和頁面的劃分。布局這里我們就要參考第一項的業務需求優先級來布局畫面分割面積。核心業務指標安排在中間位置、占較大面積；其余的指標按優先級依次在核心指標周圍展開。一般把有關聯的指標讓其相鄰或靠近，把圖表類型相近的指標放一起，這樣能減少觀者認知上的負擔并提高信息傳遞的效率。視覺上要盡量規避文字羅列或圖表羅列，注意方圓圖表的面積比例問題等，也是布局期間需要注意的事項。

4.確定設計風格與設計進行

設計風格的確定主要以下幾點來確定：設計風格的選擇切勿追求效果炫酷而不符合業務需求，選擇最合適的而不是選擇最絢爛的尤為重要。因為設計中涉及的范圍比較廣，我們在后兩章節單獨著重講解。下面展示部分我們做的不同行業對應的不同構圖布局與元素的應用案例：發動機的可視化以突出發電機產品為主，周圍 UI 以大圓角形式設計，使視覺由四周向中間包圍，集中于中心。

地鐵站的可視化以寫實風格為主，再現了真實地鐵站的樣貌，以及身臨其境的動畫交互體驗。車間可視化案例以工業風與寫實風格的車間模型濃縮了工業的運作場景，色調以貼近工業的灰色為主，設計出制造專業感十足的可視化效果。同時在設計時因為使用的設備不同，大屏有它自己獨特的分辨率、屏幕組成、色彩顯示以及運行、展示環境，這里的很多問題只有設計稿投到大屏上才能夠被發現，所以這一步在樣圖溝通確認環節非常重要，有時候需要開發出demo，反復測試多次來修改協調最終上屏效果。在測試時從設計上可以重點注重以下幾點：

之前確立的布局在放入設計內容后是否依然合適，確立的圖表類型帶入數據后是否仍然客觀準確，根據關鍵元素、色彩、結構、質感打造出的頁面風格是否基本傳達出了預期的氛圍和感受，已有的樣式、數據內容、動效等在開發實現方面是否存在問題，大屏是否存在色差、文字內容是否清晰可見、頁面是否存在變形拉伸等現象，

身處大數據時代的我們，有著許多的數據集等著我們去發掘，通過一系列的數據分析，可以明白很多事件發展的趨勢走向，不僅可以帶來更好的生活體驗，也能通過數據預測事件發生的方向。在信息時代發展迅速的前提下，數據是當今重要的信息載體，可以通過數據的捕獲，通過監管和維護去了解一個行業下關于工業管控下的數據可視化系統。

fqj