很多讀者看到漂亮的圖表都會問“這個怎么做”,“用什么工具實現”。制作漂亮的可視化一般有這樣幾個方式:
利用Excel內置的圖表做一些常規(guī)的統(tǒng)計圖。高級復雜的譬如動態(tài)圖表,圖表的篩選展示可以通過寫VBA來實現。
通過R、Python一類的數據分析語言,調用圖表功能包,呈現可視化的數據,數據分析常用。
借助Echarts、HighCharts、D3.js等開源的可視化插件,嵌入代碼,開發(fā)成插件包,可視化工程師和前端開發(fā)常用。
可視化最實用的場景就是做報表。既然這次的主題是可視化,那小編今天就細細地講一下酷炫的可視化報表是怎么做的?有哪些基礎和高級的可視化圖表?代碼開發(fā)是怎么一回事?大屏又是如何操作?
代表工具FineReport(www.finereport.com),此前介紹過其使用場景和功能。本質是一個通用的報表制作和數據可視化工具,是一個開放的商業(yè)報表工具。好比Excel,小到可以存儲統(tǒng)計數據、制作各式各樣的圖表、dashboard,大到制作財務報表、開發(fā)進銷存系統(tǒng)。大家若不熟悉,可自行和Excel綁定對比。
基礎圖表+表格柱形圖、折線圖、餅圖、氣泡圖、散點圖等能滿足常規(guī)的數據統(tǒng)計。拿到數據后,先分析要展示幾個維度,選用什么樣的圖表,需要幾個圖表展示等。
如何選擇圖表的類型?
基礎圖表的制作流程
在FineReport中,圖表的操作流程類似Excel,數據準備——插入圖表——選擇圖表類型—選擇分類軸、系列名稱和系列值——選擇圖表樣式。
各式各樣的表格
表格主要在于文字、數字、格間的美感,以及整體的色彩搭配和諧,這些在FineReport中都可通過自定義來是實現。
聚合報表復雜折疊樹報表卡片分欄報表高級圖表高級圖表都是在基本圖表的基礎上展開來一些新特性。
餅圖類:等弧度玫瑰圖、不等弧度玫瑰圖…
柱形圖類:堆積柱形圖、百分比堆積柱形圖…
條形圖類:堆積條形圖、百分比堆積條形圖…
折線圖類:堆積折線圖、面積圖…
儀表盤類:多指針的儀表盤360度、多指針的儀表盤180度、百分比圓環(huán)儀表盤、百分比刻度槽型儀表盤、試管型儀表盤…
雷達圖類:普通雷達圖、堆積柱形雷達圖…
氣泡圖類:普通氣泡圖、力學氣泡圖、十字象限氣泡圖…
地圖類:區(qū)域地圖、點地圖、大數據流向地圖…
還有各種組合圖,比如“柱形圖—折線圖、柱形圖—面積圖、堆積柱形圖—折線圖、自定義地圖”…
其他,還有漏斗圖、甘特圖、詞云、框架圖等等。
這些圖在FineReport都是現成使用的。在其他工具或其他使用場景中,可由交由可視化工程師開發(fā)。
FineReport部分圖表甘特圖(展示機器使用狀態(tài)和排期)為了高度結合數據分析的過程,更好的理解數據背后的業(yè)務意義。可視化圖表除了形態(tài)還有動態(tài)展示部分,就是所謂的動態(tài)可視化。
例1:地圖的鉆取和聯(lián)動
地圖的鉆取和聯(lián)動動效例2:圖表聯(lián)動
圖表聯(lián)動動效例3:點擊詞云跳轉鏈接
超鏈跳轉動效例4:圖表切換
圖表切換動效過去這些動態(tài)特效和交互屬性都要寫代碼開發(fā),這個在FineReport都已經封裝成一個個功能,還有圖表縮放、自動刷新、數據提示。再復雜點,就是設動態(tài)參數加超鏈。
利用開源插件開發(fā)就是用市面上開源的數據可視化工具, 譬如Highcharts、D3.js、百度Echarts、螞蟻金服AntV、GoogleCharts、Raphael.js、Sigma.js、three.js等。
像在7月,我們舉辦了一場可視化插件開發(fā)大賽上,很多開發(fā)者開發(fā)了令人心動的圖表插件。
譬如下方的3D城市全景地圖。作者Little使用Echart-GL開源庫和MapBox,與地圖結合,基于真實地圖和基本建筑數據構造都市圈級別的宏大場景,適用于政府部門、連鎖企業(yè)、LBS提供商等對真實經緯度和展現區(qū)域范圍敏感的用戶。插件的底層是WebGL(Web Graphic Library),它是一個 JavaScript API,用于在任何兼容的 Web 瀏覽器中渲染 3D 圖形。WebGL 程序由用 JavaScript 編寫的控制代碼和用 OpenGL 著色語言(GLSL)編寫的著色器代碼構成,這種語言類似于 C 或 C++,可在 GPU 上執(zhí)行。
3D城市大屏比如滾動報表圖。傳統(tǒng)的決策報表塊是靜態(tài)的,列表不會滾動,數據必須一次性展現,在大屏中效果不夠酷炫,無法自動獲取最新的數據,除非編寫大量的js代碼,對一般人來說就只能望洋興嘆。
而插件安裝后,可以用圖表的形式展現報表,通過設置數據集,顯示成類似報表塊列表,零代碼獲取數據庫信息并配置自動更新時間,支持通過字段名稱配置表頭,支持自定義顏色配置等多種豐富的配置項,這樣制作的決策報表效果也更酷炫。
實時自動更新大屏動態(tài)水球圖。插件作者Little集成了國內知名圖表庫的水球圖組件,通過簡潔明確的數據接口與功能豐富的樣式配置項,可以快速生成炫酷的水球圖以代替?zhèn)鹘y(tǒng)的儀表盤等展示百分比數據的圖表,還可以用它來顯示各種多層級的進度情況。
水球圖在大屏中的應用數據大屏大屏展現作為數據可視化的一個典型使用場景,涵蓋的知識太多。一個完整的大屏項目從開始調研到實施交付可能需要開發(fā)工程師、項目經理、視覺工程師、UI工程師、硬件工程師等等眾多專業(yè)人員的參與。
FineReport個人免費版下載鏈接:https://www.finereport.com/?utm_source=media&utm_medium=toutiao&utm_campaign=finewd