最近各大高校都陸續開學,前陣子微博各種曬錄取通知書,現在又開始曬起了開學第一天,朋友圈刷到一個親戚家的孩子曬了一張學校做的迎新數據大屏,將各學院報導數據實時展現的大屏幕上,吸引了不少學生家長圍觀,體現了學校的科技實力。
既然說到可視化大屏,必然是我很感興趣的了,於是上網搜了關於高校迎新大屏的資料,發現可視化大屏駕駛艙在高校數據應用中很火爆,於是找來了一些高校招生數據,自己動手做了一張簡單的開學迎新大屏,教程分享給大家。(數據集及源文件獲取方式見文末)
先來看幾張高校迎新大屏:
西北工業大學
浙江農林大學
數據有限,大概做了這樣一個迎新大屏:
教程直講可視化demo的製作過程,硬體部分不涉及
1、確定主題及展示指標
在設計可視化駕駛艙或大屏的時候,我們第一步要先確定我們大屏/駕駛艙的主題,然後列出我們想要在這張大屏上想要展示的數據指標和分析維度
主題:學校迎新大屏,通過對學校招生數據以及教職工數據分析,向新生展示學校招生情況及學校師資力量、辦學能力
分析維度:
2、根據數據關係選擇合適圖表
關於圖表的選擇,看我前兩天寫的圖表應用指南:,根據數據之間的關係選擇合適的圖表,可以參照下面這張經典的圖:
3、駕駛艙排版設計
根據確定好的分析指標進行排版,排版要注意主次分明,讓讀者一眼看到重點信息,提高信息傳遞的效率,把核心展現指標放在中間位置、佔較大面積,一般都會將動態效果豐富的地圖放在主要位置,抓住讀者眼球,次要指標放在屏幕兩側。還有一些輔助分析的內容,可以通過圖表聯動、鑽取體現。
可以參考如下幾種布局方式:
我的布局:
4、可視化模板製作
模板的製作,我用的FineReport,做可視化大屏非常專業,基本上不用寫什麼代碼就能開發可視化大屏,算是一個低代碼的報表開發平臺吧。
話不多說,上教程:
打開finereport,新建一張決策報表:
新建數據集,就是用sql查詢語句從資料庫中取出數據,可以添加資料庫數據,也可以直接上傳文件數據集,定義地區參數,關聯歷年各省招生數和各省分招生數(實現數據聯動),其他的取數語句我就不一一列出來,大家應該都會,不會的自己到源文件裡看
決策報表採用的是畫布式布局,可以拖拽隨意布局,根據之前設計的布局排版將所有圖表組件按照布局設計順序拖放到對應位置:
這裡面我用到了兩個圖表插件,滾動字幕和數字時鐘插件,大家可以在插件商城免費下載,點擊伺服器>插件管理
滾動字幕效果和數據時鐘效果:(不是很清楚)
然後分別給圖表組件設置類型、數據、樣式、特效,以中間的地圖設置為例:
其他圖表組件的數據和效果設置可以在源文件裡看,我這裡就不贅述了
到這一步,基本上駕駛艙的雛形就做完了,然後我們可以對背景、圖表配色細節進行美化,背景可以選擇顏色或者是圖片背景,做的匆忙我就沒高興找背景圖,直接用的顏色,點擊body>樣式 進行設置
為了更好的視覺效果我們還可以給圖表添加主題邊框,增加大屏科技感,比如我們的大屏主題:
點擊標題背景塊>屬性>樣式,上傳圖片設置:
最後保存模板,點擊預覽,效果如下:
最後,模板源文件及數據集,收藏轉發本文,後臺私信「開學」獲得!