何為大屏？Dashboard可能大家有所瞭解，就是將一些業務的關鍵指標以資料視覺化的方式展示。而大屏就是將Dashboard展示到一塊或多塊LED大屏上。經常用在公司的展覽中心、老闆的辦公室，還有城市交通管控中心、交易大廳等等。一般怎麼清楚怎麼來，怎麼酷炫怎麼搞。

帆軟算在行業內已經有了一定的名氣了。公司的fineBI、finereport報表、FineMobile等技術，有著14年的經驗和技術，可以說已經得到了市場認可。產品的樣式也很不錯，同時使用方便，大大提高了工作效率，製作大屏嘛也是很有經驗，比如下面這些：

大家一定都好奇，類似雙十一的大屏是怎麼做出來的？

製作視覺化大屏，一般有這麼幾種方案：

寫程式碼呼叫資料和圖表庫，比如寫JS+Echarts ；用現成的資料視覺化工具

前者簡單直接，直接寫程式碼就完事。但對於大部分人來說門檻較高，維護成本也很大。如果涉及大量的動態視覺化，大資料量，沒有底層技術，效能就會大打折扣。而且投到不同尺寸的螢幕，除錯起來非常麻煩。所以這種方案常常是定製。

後者則簡單不少，直接用資料視覺化工具，可以快速設計樣式呈現效果、自適應不同大小的螢幕、而且還可以實時重新整理資料，比如FineReport。

視覺化大屏設計

無論技術上採用那種方式，要想大屏做得漂亮，都要一番精心的視覺設計。

1、佈局排版

大屏首先是要服務於業務，讓業務指標和資料合理的展現。

由於往往展現的是一個企業全域性的業務，一般分為主要指標和次要指標兩個層次，主要指標反映核心業務，次要指標用於進一步闡述分析。所以在製作時給予不一樣的側重。

這裡推薦5種常見的版式。

合理的佈局能讓業務內容更富有層次，合理的配色能讓觀看者更舒適。配色的學問很複雜，這裡就先講一講背景色。背景色又分為整體背景以及單個元素的背景，無論是哪一個，都遵從兩點基本原則：深色調&一致性。

之所以選擇深色調，主要是為了避免視覺刺激。參加過大型會議的童鞋應該有感受，如果演示PPT是淺色系的，投放到大屏上後會比較刺眼，尤其是前排童鞋簡直在遭罪受。

下圖是兩個駕駛艙頁面深淺色對比，實際效果可能看圖片也許看不出來，需要投放到實際的LED螢幕檢驗測試。

細節影響感官體驗，在大屏展現上，細節也會極大的影響整體效果。通過適當給元素、標題、數字等新增一些諸如邊框、圖畫等在內的點綴效果，能幫助提升整體美觀度。

如下圖所示銷售駕駛艙大屏，頂部的標題通過左右兩個對稱線條進行點綴，各個元件的細分標題通過不規則漸變色圖片進行點綴，另外每個元件都搭配使用了簡潔的邊框以提升層次感。

動效的範圍很廣，可以從很多角度解讀，最好的參照就是PPT的動畫特效，比如前文所提的背景動畫、重新整理的載入動畫、輪播動畫、圖表的閃爍動畫、地圖的流向動畫等等，都屬於動態效果的範疇。前文說過，動效的增加能讓大屏看上去是活的，增加觀感體驗。但過分的動效極其容易喧賓奪主，讓觀看者的眼球不知道往哪裡聚焦，反而喪失了業務展現價值。這個度很難把握，既要平衡酷炫效果，又要突出內容。

列舉幾個製作的大屏動態示例demo。

如下圖所示銷售大屏，核心指標車輛總價值以數字顯示，通過FineReport 的資料監控功能，動態重新整理數值。

從佈局、背景、點綴邊框、動效等幾個方面，簡單介紹了一些大屏展現頁面製作的基本方法。其實不難發現很多環節都是相通或交叉的，比如單個元素的背景色，往往會和一些邊框一起使用。比如一些動態效果，可能是背景或者邊框本身的GIF動畫。

大屏作為資料視覺化的一個典型使用場景，其涵蓋的知識太多太多了，一個完整的大屏專案從開始調研到實施交付可能需要開發工程師、專案經理、視覺工程師、UI工程師、硬體工程師等等眾多專業人員的參與。

也許大家對這樣的大屏會嗤之以鼻，眼花繚亂，毫無實用，用華麗的視效堆疊起來博人眼球。

在效果之外，還是提倡大家更注重視覺化能否經得住業務價值的推敲？資料是否帶來了價值？是否為企業經營提供了幫助？

前些日子我一直跟幾個做資料的同行交流，不少人感嘆現在的資料分析難做，老闆動不動就要搞個大屏，在他們眼裡大屏不過就是幾個動圖投放到大螢幕上，沒有什麼技術含量。

殊不知，一張大屏的製作，不僅要在前期做大量的需求分析，還要結合UI設計、互動設計、版面設計等等，最後還得找個過硬的工具，硬體上的麻煩事情也不少，一點都不簡單。聽完這些抱怨，我更是深有體會，幾年前還十分火熱的資料報表，慢慢被資料視覺化所替代，如今大屏視覺化又成為了當下最火的名詞。

資料展示的方式越來越高大上，其實現手段也逐漸簡化，現在可能根本不需要敲程式碼，沒錯，這就是我今天要說的主題，怎麼能夠不用程式碼，做出一份完美的資料視覺化大屏？

什麼叫做完美的大屏？

超大畫面、富有科技感、酷炫的呈現效果，當我們一談到資料視覺化時，就會想到這些特點。但這不是視覺化大屏的真正意義，相比於傳統報表，大屏的目的是讓資料呈現更加直觀、快速、易於接收，下面讓我們來看看優秀的視覺化大屏到底是什麼樣。

那麼有沒有適合完全新手的視覺化工具，只需要幾分鐘就能夠上手，而且做出的效果既炫酷又實用的呢？當然有，比如我今天要推薦的FineReport，它是一款企業級的web報表軟體，除了能實現複雜的表格樣式外，還具備極其豐富的圖表，能夠滿足多樣的資料視覺化場景訴求。

如何做出視覺化的效果？

1、排版佈局

大屏的目的是為了讓領導和同事更加清晰的看到每一個數據指標，所以首先需要分析哪些維度需要展現，比如：

時間維度：什麼時間節點的業務做得最好，各個時間之間的對比地理維度：哪個地區的專案做的最出色，各地區之間的差異

然後要將這些不同的維度需要展現的點都放在設計器中，再將左側的資料拖入每個需要展現的點下面。

一個酷炫的大屏，背景顏色非常重要，一般選用深色調的顏色或者圖片，可以搭配一些帶有星空、條紋等效果的圖片可以使大屏看起來更有科技感。具體操作：伺服器—圖表預定義配色—新增新的預定義樣式—編輯圖表—系列配色選擇，偷偷告訴你們一個小技巧，預先設定好圖表預定義配色，就可以統一給圖表系列更換配色。

細節會極大的影響整體效果，需要通過適當給元素、標題、數字等新增一些諸如邊框、圖畫等在內的點綴效果，能幫助提升整體美觀度。

一、統計圖表

這裡首先給個建議：圖表樣式過多，會顯的大屏雜亂無章，一般在整個大屏中，柱狀圖所佔的比例應該要大一點。

1、種類

Finereport提供數十種統計圖，每類又包含多種風格樣式。

產品內建了官方預定義的樣式，可以根據需要選用。

擴充套件圖表外掛是基於webgl等技術開發，通過簡單拖拽即可實現自動播放、3D動畫特效等多種效果，且可以根據圖表型別和資料提供“自動輪播”和“定時重新整理”，滿足使用者不同場景下的業務需求，在體現資料價值的同時讓大屏炫酷起來。

1、三維組合地圖

開啟伺服器>外掛管理>安裝/更新擴充套件圖表，選擇擴充套件圖表—地圖類，輪播三維組合地圖，分別給四種地圖形態選取資料來源，這樣子三維組合地圖就完成了。

輪播gis點地圖，根據使用者預先錄入資料，按序播放各個地理點的相關資訊，3D視角和跳轉動畫如同身臨其境。

Finereport提供多種可選效果，如輪播、粒子技術器等，以"酷炫"和"簡潔"的方式展示最基礎的資料。

三、動態載入效果

Finereport通過元件載入動效，讓每個元件模組舞動起來，讓整個大屏介面化靜為動。更為重要的一點是，元件載入動效可以與我們的監控重新整理功能相結合。從原始資料哪裡來、過時資料往那裡去到新資料怎麼進來，兼顧整個閉環的良好體驗。

鑽取包括上卷與下鑽。上卷是通過在維級別中上升或通過消除某個或某些維來觀察更概括的資料。下鑽是通過在維級別中下降或通過引入某個或某些維來更細緻的觀察資料。

也許大家還沉浸在傳統的資料處理方式之中，對這種視覺化的大屏表示不能接受，認為其華而不實，只會博人眼球。

新鮮事物難免會讓人產生懷疑，但是我們要抓住問題的重點，即這種方式到底能不能讓資料產生價值？是否經得住業務部門的推敲？是否為企業經營提供了幫助？思考完了之後再去做大屏，這樣的視覺化才會有價值。

大屏一

大屏二

大屏三

那麼如何製作呢？

不同圖表還可以自定義配置，比如主題、字型、樣式等；

1、搜尋出圖，搜尋想要視覺化展示的資料，系統智慧適配圖表；

2、圖表儲存，加入大屏；

3、資料看板（視覺化大屏）自定義配置，看板展示；

怎麼樣，這個是不是比excel好用多了，有需要的可以get起來了~