樹狀圖一定要像樹?試試更美的形態!

2021-02-14 澎湃美數課

隔了一周,課代表又來上課啦~

今天向大家介紹一種圖表,族譜圖。哦不,是樹狀圖。 

樹狀圖一般由幾個大枝幹,再細分為小枝幹,一層一層分級。

同學們看書會製作的思維導圖也是一種樹狀圖。

比如前段時間我們把民法典的構成做成了一張思維導圖,但本質它也是個樹狀圖。

上面的這種 S 型樹狀圖,可以把要展示的信息清晰呈現,視覺閱讀上也比較流暢。

還有一種是環形樹狀圖,這種樹狀圖的好處是把內容更集中展現,展現更多的是佔比情況,不必糾結每一條信息文字的呈現。

對於數據量相對較多但無需展現密集信息的,環形樹狀圖比 S 型 樹狀圖更合適也更節省製圖的空間。

 今天課代表推薦一個可以製作 樹狀圖 的在線無代碼免費工具 —— RawGraphs👏

( https://rawgraphs.io/ )

RawGraphs 上展示的一些案例,同學們看了是否想躍躍欲試~

課代表以《諾貝爾獎去了哪裡?》為例子,分享如何製作環形樹狀圖。

製作圖表之前,我們先理清一下內容的層級關係。

▶ 第一層:以 諾貝爾六大獎項 為主枝幹

▶ 第二層:每個獎項分別由哪些 國家 獲得為次枝幹

▶ 第三層:這些國家中有  獲得諾貝爾獎為小枝椏

Step 1 : 導入我們整理好的數據。

公眾號後臺回復 03 獲取數據,進行數據測試~

 Step 2 : 選擇 Circular Dendrogram(環形樹狀圖)


Step 3-1 :  把我們的數據,拖拽到層級頁面,可以看到從中心分出六個獎項的枝幹。

Step 3-2 : 數據的位置代表層級的所在的位置,把 country 放在 award 下面,就可以看到分支下展示獲得該獎項的國家。Step 3-3 : 再把 id 拖入到層級中,讓每一個獲獎的人成為最外圈的一個節點。

Step 4:導出 svg 格式

RawGraphs 搭好我們圖表的骨架之後,我們需要用 Adobe Illustrator 來給圖表穿(mei)衣(hua)。

首先用Ai裡面的選擇工具刪除最外圈的文字。

再選中其中某一個小圓圈,在菜單欄中【選擇-相同-填色和描邊】,就可以把同樣類型的小圓圈選中,再組合(Ctrl / Command + G)。

然後進入到組合的圖層,把最外層的小圓圈刪掉。

接下去,需要給每種獎項設置不同的顏色。

我們先可以選中一簇獎項中所有內容,組合一下,然後選中上方的【重新著色圖稿】快捷修改顏色。

其他部分也進行同樣的操作,更明顯的看出不同獎項的佔比。

在外圈建立一個圓,把每個部分中間用剪刀工具切割,然後分別選取對應的顏色。為了在外圈放入每個顏色對應的獎項。

再複製一層上面的圓圈路徑,建立路徑文字,把文字剪切粘貼到路徑上,這樣文字就是弧形狀態。

但同學們會注意到,最下方三個獎項的文字,啊,你的脖子還好嗎……

所以我們需要給文字做一個翻轉,選擇要翻轉的文字,在菜單欄上方選擇【文字-路徑文字-路徑文字選項-勾選翻轉】,這樣更易閱讀👌

最後加入我們的標題和其他相關信息,我們這張圖表就完成了🥳

在此基礎上,我們還可以延展這種圖表形式,做出 S 型的樹狀圖。

方法一樣,通過 RawGraphs 做出環形樹狀圖的骨架,然後用 Adobe Illustrator 把每個部分拆分出來,凹成一個 S 型就可以,適合於信息需要全部展示的內容。
對了 ,如果你既想展示完整的內容,但時間有限。其實RawGraphs裡面還有一種簡單粗暴的形式。只要在類型中選擇 Cluster Dendrogram,簇狀樹狀圖。不過這種圖表和 S 型樹狀圖一樣,更適合數據量相對較少的,如果遇到諾貝爾獲獎的數據,這兩個類型做出來的圖會超長長長長長長長長長長。如果同學還有什麼想學的圖表,可以在我們的後臺留言👀

◒◡◒

┊推 - 薦 - 閱 - 讀┊


相關焦點

  • 河流水系形態之樹狀水系
    其中河流的水系特徵包括:流向、流程、流域面積、河道狀況及水系形態。今天我們就來聊聊河流水系形態。中國水系圖正如中國一句古話所說的「水往低處流」,所以水系形態很大程度上受到地形因素的影響,地形會影響河流水系的流域面積,以及河流的具體走向,最終影響水系形態。
  • 商品的組織化管理:樹狀圖
    ,樹狀圖也時常出現在電子商務領域,涉及商品採購和展示等。 作為一種最為常見的組織結構方式,樹狀圖也時常出現在電子商務領域。文/盧凱 樹狀圖的定義來自於計算機領域,屬於數據結構的一種形式,說它是「樹」是因為它像一棵倒掛的樹,根朝上,葉朝下。可以說是最為常見的組織結構方式。大到政府部門的組織架構,小至書籍的章節目錄,樹狀組織在我們的生活中可以說是無處不在。
  • 爸爸嫁接的樹狀月季,做成樹狀後形態各異,美的讓人移不開眼!
    我們都看慣了叢生的月季,前不久我爸爸在網上無意中看到一根筆直的樹幹上開滿了碩大的月季花,經過我爸爸的進一步的查證才知道這是樹樁月季花,是由月季花嫁接培育而來的,因為這一個發現讓我爸爸萌生了動手培育的想法,剛開始的時候還以為做成後不會臺好看,結果在做成後形態各異,美的讓人移不開眼呢! 爸爸到底是怎麼嫁接的,跟隨我一起來看一看吧!
  • 樹狀圖統籌模式在崗位職責梳理中的應用
    一、樹狀圖統籌的概念和形式(一)概念樹狀圖(Tree diagram)通俗地講,就是我們常見的一種樹形圖示,是按樹所顯示的邏輯原理繪製出的表示一定的組織層次、隸屬關係、決策順序和運行路徑的樹形結構。分解樹狀圖這是一棵樹的右倒形結構圖(見圖3),主要用於表現職責上的包含關係,描述性強,重在一分為二。
  • 醉美鞏留|蝶湖樹狀冰?今年還有?
    還記得今年蝶湖樹狀冰的新聞嗎?2020年1月10日,由鞏留縣融媒體中心拍攝的蝶湖驚現樹狀冰紋短視頻在網上發布後,先後被人民網、梨視頻、烏魯木齊爆新鮮、安徽衛視微觀天下欄目等多家媒體轉發,據不完全統計,截至目前 ,點擊量突破1.2億人次。
  • 樹狀結構如何建立?
    電腦程式員常會用到樹狀結構的資料形態,電腦的擋案資料儲存方式也都是用樹狀結構的方式去做擋案文件的管理,今天我們就來討論一下樹狀結構的建立。1.建立樹狀結構首先要先設定一個獨一無二的根目錄:樹狀結構式一個多層(嚴格說來是無限制層數),正常的一顆樹總是只有一個樹根;當然有些人會說很多樹德樹幹或樹枝上會有氣須,當氣須長的夠長的時後與大地接觸,看起來也像是有樹根,南方有很多地方的榕樹,就是代表性植物,但這是題外話,我們不多花時間討論;所以當以一顆樹只有一個樹根的方式來比喻樹狀結構
  • 醜圖百講 | 快來跟水媽學習如何繪製樹狀圖
    圖2 菜品的頻數分布柱狀圖如何更好的展示類別較多且有子分類的數據呢?接下來就進入到本講的正題:樹狀圖。樹狀圖(Treemap),又稱矩形樹圖。值得注意的是,本期討論的樹狀圖並不是學習概率時所用的分層樹形圖,也不是數據挖掘領域中決策樹模型所畫出的圖形,要注意區分。下面舉幾個例子。圖3是醜圖百講系列第一期的一張美圖。此圖是水媽從一個時尚博主那裡看到的,來自谷歌的一份報告。該圖總結了網民在谷歌上搜索某裙子的各種質地圖案的次數。質地包含了皮革、豹紋、格子等八種類別,且直接被當作背景,非常直觀。
  • 樹狀圖及製作方法(Excel 2016/Excel 2013)
    今天為大家詳細介紹一下樹狀圖的製作方法樹狀圖在Excel 2016中是一種內置的基本圖表類型,可以直接插入。而在Excel 2013及以前的版本中並沒有相應的功能。我們分別介紹在Excel 2016和Excel 2013中如何製作樹狀圖作為一種展示具有層次結構數據的圖表,樹狀圖早已經在數據分析領域流行了多年,在Excel 2016中,微軟終於把它作為一個基本圖表類型內置了。
  • 深入了解數據統計圖-樹狀圖
    作者:好PPT來源:hao_PPT微軟的office 2016版本新增的五款新的圖表
  • 思維導圖提升學生作文結構思維——樹狀圖的運用
    思維導圖有八大基礎圖形,今天我們來了解一下樹狀圖在語文教學上的運用。我們以《說和做——記聞一多先生言行片段》為例,這篇文章有著非常清晰嚴密的結構。用思維導圖樹狀圖呈現是非常合適的,方便學生通過圖文結合立刻理解文章結構,這不僅提高學生的結構思維,更加方便學生學習文章結構,便於自己在寫作文的時候可以模仿結構,通過上圖我們可以發現,文章是非常清晰的總分總結構,謀篇布局有條有理。
  • 樹狀圖解題助你一臂之力
    這裡給大家展示樹狀圖的方法,不僅給出一些看似無法下手題目的處理思路,更希望能讓大家建立起對計數知識的信心,體會思考的樂趣,而不是「望難卻步」。例1:某城市有A、B、C三個遊玩景點,樂樂去該城市度假一周,要求第二天必須和前一天遊玩不同的景點。問:周一在A景點、周五又恰好在A景點的遊玩方式有多少種?
  • 思維導圖教程:怎麼用樹狀圖進行拓展分析
    MindManager思維導圖軟體,提供了多種導圖結構,其中就有樹狀圖。其中樹狀圖多用於拓展分析,在解決數學題時,相信很多人都有用過。在MindManager中,樹狀思維導圖的製作和其他導圖結構的製作步驟是一樣的,下面我們在一起回顧下:1)在MindManager中,單擊「文件」>「新建」,在「空白模板」中,點擊選擇新建「樹狀圖」;2)在中心主題中輸入要分析的核心內容,使用快捷鍵可新建「主題」和「子主題」,
  • 【技巧】Excel如何繪製樹狀圖
    1、什麼是樹狀圖樹狀圖(Treemap),是用於展現有群組、層次關係的比例數據的一種分析工具,它通過矩形的面積
  • 高質量PPT必修圖表課(九)樹狀圖
    今天小編帶大家一起來做一款樹狀圖,說道這個名字,可能許多親們都會想到下面這個圖形:其實,EXCEL繪製的樹狀圖是這個樣子滴~這種樹狀圖傳承了傳統樹狀圖的優點,層次性強,利於展示層級關係,比如上圖就十分簡單明了地展示出A組B組之間總體大小關係以及組內分部門的銷售情況。
  • 清華狀元:給初中生的48張英語「樹狀圖」!等上高中才知道就晚了
    清華狀元:給初中生的48張英語「樹狀圖」!等上高中才知道就晚了所謂:「教有方、學有道」,指的就是無論是教與學都要遵循一定的方法,比如在教學過程中,老師能夠採用有趣的方法去教授學生們知識,學生們就能更透徹的理解。
  • Excel – 銷量分析神器:樹狀圖
    Excel 2016 的圖表中,新增了一個「樹狀圖」。這可是個絕對讓你長臉的好圖表,版本夠高的小夥伴,可千萬不要暴殄天物。樹狀圖可以提供數據的分級視圖,通常用於展示熱銷產品、業績排名等,它通過矩形的面積、顏色和排列來顯示數據關係,使大量數據的展示變得一目了然。案例:下圖 1 表格為某硬體商一季度的產品銷售額,請用可視化的形式讓老闆快速了解銷售情況。
  • 《用樹狀圖或表格求概率》教學設計
    一、教學目標【知識與技能】能運用樹狀圖和列表法計算簡單事件發生的概率。二、教學重難點【教學重點】運用樹狀圖和列表法計算涉及兩步試驗的隨機事件發生的概率。【教學難點】運用樹狀圖和列表法計算涉及兩步試驗的隨機事件發生的概率。
  • 「算法與數據結構」二叉樹之美
    前言這次梳理的內容是數據結構專題中的「樹」,如果你看到樹這類數據結構時,滿腦子頭疼,覺得它很難理解,如果是這樣子的話,那麼本文可能對你或許有點幫助。俗話說得好,要想掌握理解的話,我們得先了解它的概念,性質等內容。
  • 2019年中考數學知識點:樹狀圖法求概率
    下面是《 數學知識點:樹狀圖法求概率》,僅供參考! 樹狀圖法求概率 1、樹狀圖法 就是通過列樹狀圖列出某事件的所有可能的結果,求出其概率的方法叫做樹狀圖法。 2、運用樹狀圖法求概率的條件 當一次試驗要設計三個或更多的因素時,用列表法就不方便了,為了不重不漏地列出所有可能的結果,通常採用樹狀圖法求概率。
  • Excel也能做出徑向樹圖了
    D3有太多漂亮的可視化圖表,其中徑向樹圖看起來很舒服,適合用來顯示樹狀結構的數據,尤其是文本類的,之前也有網友在QQ群中問如何製作徑向樹圖。接下來我們就來試著製作一個徑向樹圖:添加一個徑向樹圖打開E2D3加載項後,主頁面下就有這個圖,滑鼠移到圖上時,會有按鈕提示「visualize」,點擊按鈕,就會生成一個,默認的徑向樹圖,以及一個數據表。這個圖就是D3.JS網站中的圖,一模一樣。