數據可視化常用圖表設計

? ? ? ?最近在一個項目中做數據可視化設計和實現的功能,有一些前端圖表設計和實現的收獲跟大家分享。

一、為用戶提供個性化的數據分析視圖

? ? ? ? 數據分析和數據可視化的優點不言而喻,但是數據可視化一定要結合用戶角色特征進行展示才有意義。比如普通員工和管理者角色,關注的重點肯定不同,普通員工會更注重個人績效、個人的排名等,而管理者會更注重整個部門的整體績效情況,可能還會關心整體中的一些極端個例。

? ? ? ? 所以為不同角色的用戶提供適合的數據分析視圖,才能讓數據展示有意義。

二、數據可視化常用圖表

? ? ? ? 數據可視化的常用圖表包括柱狀圖、餅圖、折線圖、散點圖、雷達圖、漏斗圖等。

? ? ? (1)柱狀圖

圖片來源:百度百科

? ? ?優點:強調個體和個體之間的差異,由于人眼對高度比較敏感所以易于比較數據間的差別;

? ? ?缺點:不適宜大量的數據集即項數較多時不適合使用;

? ? ?適用場景:一個維度的數據比較、數據單純性展示、排序數據展示等;

? ? ?適用數據:數據集不大的二維數據集;

? ? ?注意事項:通常用戶習慣認為柱狀圖的X維是時間維,可以用顏色來區分每根柱子,改變用戶對時間趨勢的看法;如果分類項目的標簽文本比較長,會出現重疊,建議使用條形圖

? ?(2)餅圖

圖片來源:百度百科

? ? ? 優點:直觀的顯示各部分的占比和分布情況,強調個體和總體的比較;

? ? ? 缺點:數據不精細,不適合分類較多的情況;

? ? ? 適用場景:一個維度各項指標(一般不超過5個項目)占總體的占比情況,分布情況;

? ? ? 適用數據:具有整體意義的各項相同數據;

? ? ? 注意事項:使用時餅圖最好不超過5個,區塊越多用戶提取數據的能力就越弱;

? ? (3)折線圖

? ? ? 折線圖分為直線折線圖和曲線折線圖。直線折線圖適用于離散變量,曲線折線圖適用于連續變量。

圖片來源:百度百度

? ? ? 優點:反應數據變化趨勢;

? ? ? 缺點:數據集太小時顯示不直觀;

? ? ? 適用場景:需要反應變化趨勢、關聯性;

? ? ? 適用數據:時間序列數據,關聯類數據;

? ?(4)散點圖

? ? 散點圖還有一種變形是氣泡圖,氣泡圖通過每個點的面積大小反映第三維。

圖片來源:百度百科

? ? ?優點:直觀反映數據集中情況,對離散數據線性回歸等曲線預測性的擬合輔助作用;

? ? ?缺點:適用場景比較少;

? ? ?適用場景:對離散數據進行預測,兩個維度的數據;

? ? ?適用數據:離散值數據;

? (5)其他數據分析常用圖

? ? 熱力圖,用于表示密集程度,可以直觀清楚地看到頁面上每一個區域的訪客興趣焦點,圖形化展示,清晰直觀;

圖片來源:百度百科

? ? 漏斗圖,用于表示數據轉化類關系,適用于業務流程比較規范、周期長、環節多的流程分析,通過漏斗各環節業務數據的比較,能夠直觀地發現和說明問題所在;

圖片來源:知乎

? ? 儀表盤,指標類數據;

? ? 雷達圖,適用于多維數據(四維數據),且每個維度必須可以排序。

圖片來源:百度百科

? ? 最后其他最重要的核心數據,直接用數字顯示,最直觀。

三、數據可視化主要技術

前端常用的可視化技術主要有d3.js、echarts、highcharts;

其中d3.js的定制化更強,但是美觀度和工作量需要自己把握;echarts由百度提供,免費使用,開發工作量小,但是定制化能力弱;highcharts和echarts比較類似但是需要商業授權。

highcharts和d3.js是基于SVG渲染的,性能差些,但是是基于DOM操作的,用戶交互更精確,可以通過virtual dom技術解決性能差的問題,如react前端框架。

echarts基于canvas渲染的,性能更好些。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 圖表思維是數據分析思維中的最簡單和最基本的思維,主要是通過圖形和表格對數據進行轉化。 文字有局限 看到這段話,你會...
    keeya閱讀 5,738評論 1 21
  • 定義 數據可視化的目的其實就是直觀地展現數據,例如讓花費數小時甚至更久才能歸納的數據量,轉化成一眼就能讀懂的指標;...
    Kemr閱讀 3,146評論 0 20
  • 根據下面各個框架本身的特性,以及各自的優缺點,推薦使用D3或者ECharts作為數據可視化的首選框架,某些小特性可...
    Endzzz閱讀 27,522評論 5 53
  • 一個人行走的范圍,就是他的世界——北島 春天是個適合出游的季節,因為它的陽光不像夏天那樣熱烈,也不像秋天那么干燥,...
    花魚的四季閱讀 402評論 0 1
  • 當我在路上跑步的時候,我感覺自己就是一位圣人。 ——《跑步圣經》 不經意的開始 從零九年開始跑步,今...
    甬上玫子閱讀 268評論 0 0