編輯導語：一張圖表的産生背後有其結構和邏輯，本篇文章作者介紹了圖表的産生過程，講述了一個圖表的基本結構、數據的相關内容以及可視化過程中的步驟等，感興趣的一起來學習一下，希望對你有幫助。

我在之前的文章提到過，今年3月份我轉行到低代碼産品領域，轉行後負責的第一個模塊就是圖表。

幾乎所有的圖表産品都會包括兩大塊：數據源和可視化，而我負責的是數據可視化的部分。

在我之前的認識裡，數據可視化其實就是各種圖表，了解清楚每個圖表的應用場景就夠了。比如你應該知道柱狀圖、折線圖和環圖之間的區别，這就夠了。

但負責了低代碼産品的圖表模塊之後，我需要讓用戶可以通過拖拽的方式自己搭建出不同類型的圖表，這要求産品經理從原理上了解一個圖表是如何産生的。

這種從底層邏輯到業務應用的推演非常有意思，當然對于我入門低代碼的圖表模塊也非常重要。

想要寫出來，也是想跟大家分享如何從底層去認識一個我們之前可能以為自己比較了解的産品。

01

一個圖表的結構通常如下圖所示：包括數據源和數據可視化兩部分。

數據源其實就是通過各種方式得到一張基礎表，這個基礎表代表了我們記錄業務的所有明細數據。典型的基礎表格式是 1 N，第一行是記錄信息所需要的所有字段，第 2-N 行代表的是每一個實體的具體信息。

舉個例子，我可以用下面這張表記錄一個學校高一年級所有學生的基本信息。

從第二行開始，我就要錄入每一個學生的信息，假設現在有 5 名學生，則這個基礎表的信息可以展示為，而這個對于可視化系統來說，就是一個标準的數據源。

順便說一句，雖然本文不聊數據源，但數據結構的确定是可視化的重要前提，非常非常重要。當我們要去建立一個業務的數據模型時，我們一定要想清楚到底有哪些字段是需要添加的，每個字段的類型是什麼。

字段可以多，但一定不能缺，如果我們一開始沒有星座這個字段，忽然有一天你突發奇想，覺得我們可以看看學校裡不同星座的學生的占比，那意味着底層的數據模型就要變動，這時候所有用到這個模型的圖表，可能都會受到影響。

回到正題，「可視化」就是要通過更直觀的方式呈現我們想要看到的結論。

它滿足兩點要求：首先必須要直觀，為了這一點，我們應該發明了很多不同的圖表類型，後面會講到；其次，它必須要支撐我們想看的結論，不帶任何目标的可視化，都是無用功。

我将可視化部分總結為三個具有前後順序的動作：數據分組、數據計算和可視化。這也是本文的重點，我将詳細說明。

02

數據分組是确定從什麼視角看什麼數據，這與我們想要分析的結論息息相關。事實上，當我們準确描述我們想要看的結論時，我們就已經在無形中确定了我們的數據分組。

比如，我們想要看不同班級學生的中考分數，這時候「不同班級」就是我們的切分視角，「班級」這個字段，就成了我們的維度。

确定分組之後，我們就可以按照班級這個字段的不同值，将基礎表分為如下幾張表：

在上述結論中，隐含的另一個重要概念是指标，我們切分不同的班級之後，想看的不是年齡，也不是星座，而是中考分數。指标，就是我們想要看的數據。

确定了維度和指标，真正的數據分組才算完整，他們應該是下面這三組表。

03

數據計算，就是給指标附上一個具有統計意義的值。這個值是從指标字段的明細數據中計算得來的，也可以說是聚合得來的，所以我們一般叫做聚合函數。

例如對于 2 班的兩個學生來說，中考分數分别為 560 和 572，如果我想看大家的平均分，那就是對這兩個明細數據求平均，如果我想看每個班學生的最高分呢，用的就是求最大值函數。

相同的明細數據經過不同的聚合函數作用後，會得到不同的結果，因而聚合函數直接反映了我們想要統計的目标。

如果我們想要評估的是不同班級學生的底子水平如何呢？那可能平均分是一個不錯的聚合函數。但如果某些班級有中考加分的學生，而這裡的分數是正常文化課的分數，那我們看平均分可能就不客觀了，這之後中位數應該是一個更好的選擇。

無論如何，随着我們想要分析的結論和明細數據的質量不同，我們選擇不同的聚合函數，這個過程，就是數據計算。

經過數據計算之後，維度和指标就都有了統計含義，以平均分為例。

事實上，實際情況可能比這個複雜得多。實際場景中的維度可能不止一個，想要看的指标也不止一個，或者指标不是數字，這時候該怎麼辦呢？

04

聊聊維度嵌套和多指标。

什麼時候我們會有維度嵌套呢，就是某一個單獨的字段無法滿足我們切分數據的需求。我們對上述的例子擴充一些樣本來解釋這個問題。

如果我想看不同班級中不同年齡學生的中考分數，那「不同班級中不同年齡」這個分組标準可以用一個字段分出來麼？顯然是不行的。

此時我們分組的角度會變成先看「班級」，再看「年齡」，這就是維度嵌套的情況，它是由兩個字段合起來決定一個分組的。這時候的分組就會變成

• 1 班-15 歲-平均分；
• 1 班-16 歲-平均分；
• 1 班-17 歲-平均分；
• 2 班 -16 歲-平均分；
• 2 班-17 歲 -平均分；
• 3 班-16 歲 -平均分。

很明顯，維度嵌套時，分組就變多了。理論上，維度可以一直嵌套下去，比如我在上述每一個分組的基礎上，再按照星座去進一步細分組别。

當然，這隻是邏輯上的可行性，是否需要這麼分，完全要看「要得到目标結論是否需要這麼分」，還是那句話，可視化建立在業務分析目标上的。

除了維度嵌套，還有多指标的情況。如果我想要看的是不同班級學生的年齡數據和中考分數數據，這時候「年齡」就不再是維度，而變成了指标。

多指标不存在嵌套的情況，每個指标都是獨立計算的，所以相較于多維度來說，多指标的情況應該更簡單一些。

05

在我小學的時候，其實就已經接觸過圖表了，那時候所有的指标都默認是數字，所以他們可以做很多聚合運算。

但是當我做低代碼産品的時候，我發現任何具有統計意義的字段都可以作為指标。具有統計意義和數字類型不一定是相等的：金額、年齡、分數，這些數字類型的字段當然具有統計意義，但是你想過沒有，文本類型的字段有沒有統計意義呢？

還是上面那個表，如果 2 班的文藝委員，想了解自己班上一共有多少個不同星座的學生，能不能統計呢？

可以。那不同的星座該怎麼統計呢？這就要用到去重計數這個聚合函數。

所以，非數字類型字段作為指标時，如果具有統計意義，往往會用到計數和去重計數這兩個聚合函數。

你隻需要記住，非數字類型的字段也是可以作為指标的。但并不是所有的都可以，如果某個字段存儲的是一張照片，那确實就沒啥統計的必要了。

有人問？難道我不能統計一堆照片的平均像素大小麼？可以的，但這時候，照片和照片像素應該是兩個字段，你要統計的，其實是照片像素這個字段，本質上還是一個數字類型的字段。

06

講到這裡總結一下，基礎表在可視化中需要完成兩個基本的步驟，分組和計算。分組主要看維度和指标，計算主要看聚合函數。當然維度可以有多個，指标可以有多個。

接下來便是可視化的核心步驟，從數據到圖表的映射，更簡單一些，就是将表格承載的數據，變成可視化的圖表。

目前市面上主流 bi 産品支持的圖表類型非常多，常見的包括：透視表、指标卡、柱狀圖、條形圖、折線圖、面積圖、組合圖、餅圖、散點圖、雷達圖、漏鬥圖、熱力圖、地圖、桑基圖等等。

我們以常見的柱狀圖為例來說明數據到圖表的映射。

面對任何一種圖表，我們首先要想的是，維度和指标分别放在哪裡，限制如何。

以柱狀圖為例，它的 x 軸一般作為維度，y 軸一般作為指标，且隻有一個 x 軸和一個 y 軸，常見的用法如下：

這張圖我們看到的就是不同學校有多少人獲獎。

除此之外，還有第三個能夠承載信息的元素是顔色，顔色也可以承載信息，它既可以是維度，也可以是指标，就看怎麼用，如下圖：

這種情況下，我的 y 軸就是三個指标字段共用了，用顔色這個元素來區分，但本質上，他們是被獨立觀察的三個指标。

我也可以用顔色承載維度，做維度的嵌套，看一個指标。

這時候，我們看的就是不同學校中不同狀态的學生的獲獎記錄數據。

需要注意的是，一張圖表中，顔色隻能承載維度或者指标，不能同時兼任。

07

完成了數據到圖表的映射之後，一張基本的圖表就渲染出來了。當然我們還可以給它配置更多的信息，比如标題，比如每個柱子上的數據标簽，甚至用堆積柱狀圖看不同狀态學生的百分比。

但是萬變不離其宗，再豐富的展示樣式背後，其實都是從數據源→數據分組→數據計算→可視化這一套系統流程，我們在腦子裡思考後手動繪制也好，我們通過無代碼的方式搭建出來也好，底層邏輯基本都是這一條鍊路。

掌握了底層邏輯，才能在處理不同場景下的應用問題時做到有條不紊。

08

說點題外話，當我剛剛接手圖表這個功能模塊的時候，有很多業務方提了各種需求過來，也有之前積壓的很多遺留需求。那時候我覺得，真的好難。

面對每一個單點的問題，雖然我能夠通過自己做産品的基本素養去理解問題并提出解決方案，但解決這個問題和解決下個問題之間，我并沒找到本質上的聯系。

用經濟學的話來說，我解決問題的邊際成本是沒有變的。

但是當我逐漸理解了一張圖表背後的底層邏輯之後，很多問題在我看來都是一個問題，我開始梳理清楚了不同需求之間的關系和脈絡。在這個時候我才逐漸覺得，這項新工作我應該是入門了。

我把這一切分享出來，也是希望大家，尤其是各位産品經理，在自己負責的領域内，努力找到你所能挖掘到的最深層次的通用邏輯。

#專欄作家#

大力哥呀，大力哥，人人都是産品經理專欄作家。一個90後産品經理，已經寫了6年的公衆号，通過輸出獲得了許多意料外的成長。

本文原創發布于人人都是産品經理。未經許可，禁止轉載。

題圖來自Unsplash，基于CC0協議。

,

更多精彩资讯请关注tft每日頭條，我们将持续为您更新最新资讯!

查看全部