1. <strong id="7actg"></strong>
    2. <table id="7actg"></table>

    3. <address id="7actg"></address>
      <address id="7actg"></address>
      1. <object id="7actg"><tt id="7actg"></tt></object>

        實(shí)戰(zhàn)技巧 | 數(shù)據(jù)可視化圖表應(yīng)用

        共 3747字,需瀏覽 8分鐘

         ·

        2021-04-27 13:45

        點(diǎn)擊"三分設(shè)"關(guān)注,回復(fù)"社群"加入我們

        歡迎來(lái)到專業(yè)設(shè)計(jì)師學(xué)習(xí)交流社區(qū)

        三分設(shè)|連接知識(shí),幫助全球 1 億設(shè)計(jì)師成長(zhǎng)

        轉(zhuǎn)自:京東設(shè)計(jì)中心JDC

        編輯:韓平平

        本文共 3685 字,預(yù)計(jì)閱讀 10 分鐘



        一、數(shù)據(jù)可視化概述

        數(shù)據(jù)科學(xué)的大力發(fā)展,讓信息科學(xué)領(lǐng)域面臨的一個(gè)巨大挑戰(zhàn)就是數(shù)據(jù)爆炸。據(jù) 2020 年統(tǒng)計(jì),世界數(shù)字化的信息總量在 35.2*(10^21) 字節(jié)。然而人類(lèi)分析數(shù)據(jù)的能力已經(jīng)遠(yuǎn)遠(yuǎn)落后于獲取數(shù)據(jù)的能力。這個(gè)挑戰(zhàn)不僅在于數(shù)據(jù)量越來(lái)越大、越多元化,更重要的是 數(shù)據(jù)獲取的動(dòng)態(tài)性,數(shù)據(jù)內(nèi)容的噪聲讓人們?cè)邶嬰s的數(shù)據(jù)世界中倍感枯燥繁瑣,同時(shí)傳統(tǒng)的數(shù)據(jù)分析報(bào)告對(duì)于非專業(yè)人員來(lái)講有一定的門(mén)檻,其理解成本較高。這就讓數(shù)據(jù)可視化的出現(xiàn)賦予其特有的意義。但需要注意的是,為了數(shù)據(jù)可視化而可視化采用復(fù)雜的圖形,將它看成藝術(shù)創(chuàng)作的過(guò)程那就大錯(cuò)特錯(cuò)了,數(shù)據(jù)可視化需要達(dá)到 “真、善、美” 的均衡,達(dá)到有效挖掘,實(shí)現(xiàn) 設(shè)計(jì)與功能之間的平衡。


        二、數(shù)據(jù)可視化流程

        數(shù)據(jù)可視化整體流程是包含用戶操控的整體閉環(huán)。從數(shù)據(jù)空間到可視空間的映射,中間包含了數(shù)據(jù)處理的各階段以及可視化處理中從布局到樣式的選擇,最終展現(xiàn)出 可交互式數(shù)據(jù)圖表



        三、數(shù)據(jù)可視化原則

        數(shù)據(jù)可視化的首要任務(wù)是準(zhǔn)確地展示和傳達(dá)數(shù)據(jù)所包含的信息。在此前提下,針對(duì)特定的用戶對(duì)象,設(shè)計(jì)者可以根據(jù)用戶的預(yù)期和需求,提供有效輔助手段以方便用戶理解數(shù)據(jù),從而完成有效的可視化。具體包括:數(shù)據(jù)到可視化的直觀映射,恰當(dāng)?shù)囊晥D選擇與交互、展示合適的信息密度、美學(xué)聚焦與平衡、可視化隱喻等。

        (在堆疊柱狀圖的基礎(chǔ)可視化圖表上采用咖啡杯、標(biāo)記和顏色生成各種咖啡的可視化隱喻,生動(dòng)地展現(xiàn)了不同種類(lèi)咖啡的水、牛奶等的比例。)


        四、可視化圖表的構(gòu)成

        圖表一般是由:標(biāo)題、圖例、刻度軸、數(shù)據(jù)展示、網(wǎng)格線、提示信息、水位線、時(shí)間軸、Hover Tooltip 等組成。在實(shí)際應(yīng)用中不一定要將全部元素展現(xiàn)出來(lái),提供需要的信息即可,見(jiàn)下圖:


        1、圖例
        • 圖例的組成:圖形、名稱、數(shù)值、單位。

        • 圖例樣式:不同類(lèi)型的圖表建議選用各自的圖例形態(tài),目的是在復(fù)合型圖表中可通過(guò)圖例來(lái)判斷圖表中包含幾種圖表類(lèi)型以作區(qū)分。

        • 共用圖例:多個(gè)圖表的圖例相同,可共用一個(gè)圖例,減少冗余信息。



        • 圖例名稱限制:特定業(yè)務(wù)場(chǎng)景下,圖例名稱可能會(huì)很長(zhǎng),為了達(dá)到更好的展示效果,圖例名稱可設(shè)定最大值同時(shí)做省略處理。




        五、基礎(chǔ)圖形及特點(diǎn)

        1、折線圖(Line Chart)
        • 關(guān)鍵詞:變化趨勢(shì)、增減速率

        • 適用場(chǎng)景:折線圖用來(lái)顯示數(shù)據(jù)在一個(gè)連續(xù)時(shí)間間隔或者時(shí)間跨度上的變化,它的特點(diǎn)是反映出事物隨著時(shí)間或其他變量變化的趨勢(shì)以及增減的速率。如折線條數(shù)過(guò)多時(shí)不建議將多條數(shù)據(jù)繪制在一個(gè)圖表中,這樣很難看出不同類(lèi)別的情況。



        1.1、曲線圖(Curve Chart)
        • 關(guān)鍵詞:整體趨勢(shì)

        • 適用場(chǎng)景:當(dāng)數(shù)據(jù)反映的為整體趨勢(shì)時(shí)建議使用曲線圖,尤其是當(dāng)數(shù)據(jù)波動(dòng)較大時(shí),如采用折線圖會(huì)讓圖表整體比較混亂,不利于信息展示。



        1.2、面積圖(Area Chart)
        • 關(guān)鍵詞:趨勢(shì)、對(duì)比

        • 適用場(chǎng)景:面積圖是在折線圖的基礎(chǔ)之上形成的, 它將折線圖中折線與自變量坐標(biāo)軸之間的區(qū)域使用顏色或者紋理填充,這樣一個(gè)填充區(qū)域我們叫做面積,顏色的填充可以更好的突出趨勢(shì)信息,需要注意的是顏色要帶有一定的透明度,透明度可以很好的幫助使用者觀察不同序列之間的重疊關(guān)系,沒(méi)有透明度的面積會(huì)導(dǎo)致不同序列之間相互遮蓋減少可以被觀察到的信息。



        2、柱形圖(Bar Chart)
        • 關(guān)鍵詞:趨勢(shì)、分類(lèi)對(duì)比

        • 適用場(chǎng)景:柱形圖借助于本身高度,能夠較清晰的反映數(shù)據(jù)之間的差異性,一般會(huì)用作不同角色間的對(duì)比關(guān)系,同時(shí)也可用來(lái)反映變化趨勢(shì)。通常來(lái)說(shuō),柱形圖的橫軸更多會(huì)展現(xiàn)時(shí)間維度,用戶會(huì)習(xí)慣性的認(rèn)為存在時(shí)間趨勢(shì)。如果遇到橫軸為時(shí)間維度以外的變量,建議用顏色區(qū)分每根柱子。



        2.1、堆疊柱形圖(Stacked Column Chart)
        • 關(guān)鍵詞:趨勢(shì)、對(duì)比、占比

        • 適用場(chǎng)景:展示不同角色的數(shù)據(jù)值,同時(shí)能夠反映每個(gè)系列的數(shù)據(jù)總和。當(dāng)表示占比時(shí),每列柱子頂頭(意為占比總和為100%),可觀察不同角色的占比情況。


        2.2、嵌套柱形圖(Nested Column Chart)
        • 關(guān)鍵詞:雙維度、對(duì)比

        • 適用場(chǎng)景:柱形圖的嵌套可用于展示同一角色下的雙維度數(shù)據(jù)指標(biāo)對(duì)比。





        3、子彈圖(Bullet Chart)
        • 關(guān)鍵詞:現(xiàn)狀、目標(biāo)值、階層

        • 適用場(chǎng)景:子彈圖很形象的展現(xiàn)出子彈射出后帶出的軌道圖,每個(gè)子彈圖只能顯示單一的數(shù)據(jù)信息源,通過(guò)下方的標(biāo)尺可以顯示出更精確的階段性數(shù)據(jù)信息,同時(shí)表達(dá)一項(xiàng)數(shù)據(jù)與目標(biāo)的校對(duì)結(jié)果。



        4、餅圖(Pie Chart)
        • 關(guān)鍵詞:占比

        • 適用場(chǎng)景:描述某一部分占整體的百分比。將份額最大的部分放在 12 點(diǎn)方向,順時(shí)針?lè)胖玫诙蠓蓊~的部分,以此類(lèi)推。需要注意的是:如需比較數(shù)據(jù)時(shí),可使用條形圖或柱狀圖,切勿將扇形轉(zhuǎn)化為數(shù)據(jù)在餅圖間比較,因?yàn)槿说娜庋蹖?duì)面積大小不敏感,易導(dǎo)致對(duì)數(shù)據(jù)的誤讀。



        5、旭日?qǐng)D(Sunburst)
        • 適用場(chǎng)景:也稱為 “多層餅形圖” “徑向樹(shù)圖”,通過(guò)一層層圓環(huán)顯示層次結(jié)構(gòu),按不同類(lèi)別節(jié)點(diǎn)進(jìn)行切割。適用于擴(kuò)展每一層級(jí)的細(xì)分?jǐn)?shù)據(jù)指標(biāo)情況。



        6、散點(diǎn)圖(Scatter Chart)
        • 關(guān)鍵詞:關(guān)聯(lián)、分布

        • 適用場(chǎng)景:散點(diǎn)圖用于研究?jī)蓚€(gè)變量之間關(guān)系的經(jīng)典圖表。數(shù)據(jù)量小的情況下會(huì)比較分散且混亂,看不出分布邏輯,該情境下不建議使用。



        6.1、氣泡圖(Bubble Chart)
        • 關(guān)鍵詞:關(guān)聯(lián)、分布、大小

        • 適用場(chǎng)景:用氣泡大小代替散點(diǎn)圖中的數(shù)值點(diǎn),面積大小代表數(shù)值大小。



        7、雷達(dá)圖(Radar Chart)
        • 關(guān)鍵詞:多維數(shù)據(jù)

        • 適用場(chǎng)景:將多個(gè)分類(lèi)的數(shù)據(jù)量映射到坐標(biāo)軸上,可對(duì)比項(xiàng)目?jī)?nèi)不同屬性的情況。但當(dāng)指標(biāo)變量過(guò)多,雷達(dá)圖會(huì)顯示的比較混亂,數(shù)據(jù)點(diǎn)一般 6 個(gè)左右。



        8、漏斗圖(Funnel Chart)
        • 關(guān)鍵詞:步驟、流轉(zhuǎn)

        • 適用場(chǎng)景:漏斗圖展現(xiàn)業(yè)務(wù)流程比較規(guī)范,從上到下有邏輯上的順序關(guān)系,適用于有固定流程并且環(huán)節(jié)較多的分析。通過(guò)各環(huán)節(jié)業(yè)務(wù)數(shù)據(jù)能夠說(shuō)明問(wèn)題所在進(jìn)而做出決策,能直觀顯示流轉(zhuǎn)情況。漏斗圖還可擴(kuò)展為“對(duì)稱漏斗圖”,同時(shí)對(duì)兩個(gè)業(yè)務(wù)流程進(jìn)行分析,對(duì)比兩者的數(shù)據(jù)情況。



        9、?;鶊D(Sankey Diagram)
        • 關(guān)鍵詞:分流、大小

        • 適用場(chǎng)景:?;鶊D用來(lái)描述一組指標(biāo)到另一組指標(biāo)的流轉(zhuǎn)情況。在內(nèi)部,不同色值代表了不同指標(biāo)下的分流情況,流轉(zhuǎn)寬度表達(dá)相應(yīng)數(shù)據(jù)量的大小。



        10、熱力矩陣圖(Heat map)
        • 關(guān)鍵詞:顏色、交叉、多變量

        • 適用場(chǎng)景:通過(guò)顏色變化來(lái)顯示數(shù)據(jù),適合交叉檢查多變量數(shù)據(jù),整體觀察數(shù)據(jù)之間的差異性和相關(guān)性。



        10.1、矩形樹(shù)圖(Rectangular Tree Diagram)
        • 適用場(chǎng)景:利用嵌套式矩陣顯示層次結(jié)構(gòu)的方法,用于展現(xiàn)同一層級(jí)下不同分類(lèi)的情況,通過(guò)面積大小顯示每個(gè)類(lèi)別的數(shù)量。



        11、箱線圖(Box Plot)
        • 適用場(chǎng)景:又稱 “盒須圖”,支持展現(xiàn)數(shù)據(jù)的上級(jí)限、上四分位數(shù)、中位數(shù)、下四分位數(shù)、下極限,垂直或水平的方式展示均可,從箱體兩端延伸出來(lái)的線條稱為 “晶須”,用來(lái)表示上、下四分位數(shù)以外的變量。異常值有時(shí)會(huì)與晶須處于同一水平的單一數(shù)據(jù)點(diǎn)表示。箱形圖通常用于描述性統(tǒng)計(jì)。



        12、燭臺(tái)圖(Candlestick Chart)
        • 適用場(chǎng)景:又稱 “日本 K 線圖”,通常用來(lái)顯示和分析證券、衍生工具、外匯貨幣、股票、債券等商品隨著時(shí)間的價(jià)格變動(dòng)。蠟燭圖通過(guò)使用燭臺(tái)式的符號(hào)來(lái)顯示多種價(jià)格信息,如:開(kāi)盤(pán)價(jià)、收盤(pán)價(jià)、最高價(jià)和最低價(jià),每個(gè)代表單一時(shí)間段(每分鐘、每小時(shí)、每天或每月)的交易活動(dòng)。每個(gè)燭臺(tái)符號(hào)沿著 X 軸上的時(shí)間刻度繪制,顯示隨著時(shí)間推移的交易活動(dòng)。




        六、總結(jié)

        數(shù)據(jù)可視化的作用體現(xiàn)在多個(gè)方面,如揭示想法和關(guān)系、形成論點(diǎn)或意見(jiàn)、觀察事物演化的趨勢(shì)、傳播和探索性數(shù)據(jù)分析等??梢燥@著提高分析信息的效率,最主要的原因是其擴(kuò)充了人腦的記憶,幫助人腦形象地理解和分析所面臨的任務(wù)。對(duì)于數(shù)據(jù)可視化圖表的理解與認(rèn)識(shí)是基礎(chǔ),在此基礎(chǔ)之上可以嘗試多視圖協(xié)調(diào)關(guān)聯(lián),甚至根據(jù)數(shù)據(jù)需求創(chuàng)作出新的視圖,感受數(shù)據(jù)可視化的樂(lè)趣所在。

        參考文獻(xiàn):《數(shù)據(jù)可視化》-陳為、沈則潛、陶煜波等編著 電子工業(yè)出版社。



        超值課程推薦
        華為用戶體驗(yàn)設(shè)計(jì)的體系搭建方法
        超 10 億用戶的產(chǎn)品,到底是怎么做用戶體驗(yàn)的?
        揭秘滴滴、蔚來(lái)等大廠的用戶體驗(yàn)設(shè)計(jì)策略
        原創(chuàng)好文推薦
        十個(gè)技巧幫助你設(shè)計(jì)一款在線學(xué)習(xí) APP
        如何進(jìn)行產(chǎn)品優(yōu)先級(jí)排序?帶你掌握 5 種好用的排序框架
        全新 Spotify 社交功能構(gòu)建分析
        Web Vitals —— 谷歌的新一代 Web 性能體驗(yàn)和質(zhì)量指標(biāo)
        一款為你帶來(lái)難忘體驗(yàn)的美食 APP
        如何制作打動(dòng)面試官的作品集,這里有一份完整的指導(dǎo)手冊(cè)
        向標(biāo)桿致敬:移動(dòng)用戶體驗(yàn)的 7 個(gè)設(shè)計(jì)原則



        歡迎大家關(guān)注三分設(shè),每天分享優(yōu)質(zhì)設(shè)計(jì)、創(chuàng)意靈感、新知新識(shí),定期大咖老師直播分享,零距離連麥,答疑解惑。

        瀏覽 85
        點(diǎn)贊
        評(píng)論
        收藏
        分享

        手機(jī)掃一掃分享

        分享
        舉報(bào)
        評(píng)論
        圖片
        表情
        推薦
        點(diǎn)贊
        評(píng)論
        收藏
        分享

        手機(jī)掃一掃分享

        分享
        舉報(bào)
        1. <strong id="7actg"></strong>
        2. <table id="7actg"></table>

        3. <address id="7actg"></address>
          <address id="7actg"></address>
          1. <object id="7actg"><tt id="7actg"></tt></object>
            麻豆精品一区二区三区的成功之道 | 亚洲色欲激情 | 听黄色小说 | 国产又大又硬又粗 | 亚洲va国产va天堂va久久 | 成人免费无码婬片在线看片视频 | 人人操在线观看 | 教室呻吟用力湿冰山校草 | 成人无码区免费A∨视频FBI | 美女裸体网站国产 |