ECharts數(shù)據(jù)可視化實(shí)戰(zhàn)-ECharts中的其它圖表

ECharts中的其它圖表目錄1繪制散點(diǎn)圖、氣泡圖繪制儀表盤(pán)2繪制漏斗圖（或金字塔）3繪制雷達(dá)圖詞、云圖和矩形樹(shù)圖44.ECharts中的其它圖表前面章節(jié)介紹了在ECharts中的制作三大圖表及常用組件的制作方法。本章將探討另外一些常見(jiàn)圖表在ECharts中的制作：在研究大規(guī)模數(shù)據(jù)中兩個(gè)變量之間的相關(guān)關(guān)系時(shí)，適合使用散點(diǎn)圖；在研究展示三個(gè)變量的關(guān)系時(shí)，則合適使用氣泡圖；儀表盤(pán)與漏斗圖是常用的商業(yè)BI（商業(yè)智能：BusinessIntelligence）類的圖表；雷達(dá)圖對(duì)于查看哪些變量具有相似的值、變量之間是否有異常值都很有用；詞云圖對(duì)文本中出現(xiàn)頻率較高的“關(guān)鍵詞”予以視覺(jué)化的展現(xiàn)。矩形樹(shù)圖則用于展現(xiàn)現(xiàn)有群組、層次關(guān)系比例數(shù)據(jù)的一種分析工具。4.1繪制散點(diǎn)圖、氣泡圖在大數(shù)據(jù)時(shí)代，人們更關(guān)注數(shù)據(jù)之間的相關(guān)關(guān)系而非因果關(guān)系。那么如何考量各變量之間的相關(guān)關(guān)系呢？散點(diǎn)圖(scatter)就是一種最直觀簡(jiǎn)單的形式。散點(diǎn)圖，它既能用來(lái)呈現(xiàn)數(shù)據(jù)點(diǎn)的分布，表現(xiàn)兩個(gè)元素的相關(guān)性，也能像折線圖一樣表示時(shí)間推移下的發(fā)展趨勢(shì)。可以說(shuō)是最靈活多變的圖表類型。本節(jié)通過(guò)實(shí)例，介紹如何在ECharts中創(chuàng)建散點(diǎn)圖和氣泡圖。4.1.1繪制散點(diǎn)圖散點(diǎn)圖（scatter），顧名思義就是由一些散亂的點(diǎn)組成的圖表，這些點(diǎn)在哪個(gè)位置，是由其X值和Y值確定。所以也叫做XY散點(diǎn)圖。如果將圖表區(qū)域比做一個(gè)盤(pán)子，那么這些點(diǎn)就像“大珠小珠落玉盤(pán)”中的珍珠；又似顆顆繁星，分布在廣袤的星空。散點(diǎn)圖又稱散點(diǎn)分布圖，是以一個(gè)變量為橫坐標(biāo)，另一變量為縱坐標(biāo)，利用散點(diǎn)（坐標(biāo)點(diǎn)）的分布形態(tài)反映變量統(tǒng)計(jì)關(guān)系的一種圖形，因此，需要為每個(gè)散點(diǎn)至少提供兩個(gè)數(shù)值。特點(diǎn)是能直觀表現(xiàn)出影響因素和預(yù)測(cè)對(duì)象之間的總體關(guān)系趨勢(shì)。優(yōu)點(diǎn)是能通過(guò)直觀醒目的圖形方式反映變量間關(guān)系的變化形態(tài)，以便決定用何種數(shù)學(xué)表達(dá)方式來(lái)模擬變量之間的關(guān)系。4.1.1繪制散點(diǎn)圖散點(diǎn)圖的核心思想是：研究，它屬于研究型圖表。適合用于發(fā)現(xiàn)變量間的關(guān)系與規(guī)律，不適合用于清晰表達(dá)信息的場(chǎng)景。散點(diǎn)圖包含的數(shù)據(jù)越多，比較的效果就越好。

在默認(rèn)情況下，散點(diǎn)圖以圓點(diǎn)顯示數(shù)據(jù)點(diǎn)，參見(jiàn)代碼4-1。如果在散點(diǎn)圖中有多個(gè)序列，可考慮標(biāo)記圖形更改為方形、三角形、菱形或其它形狀，參見(jiàn)代碼4-2。4.1.1繪制散點(diǎn)圖通過(guò)觀察散點(diǎn)圖上數(shù)據(jù)點(diǎn)的分布情況，可以推斷出變量間的相關(guān)性：如果變量之間不存在相互關(guān)系，那么在散點(diǎn)圖上就會(huì)表現(xiàn)為隨機(jī)分布的離散的點(diǎn)；如果存在某種相關(guān)性，那么大部分的數(shù)據(jù)點(diǎn)就會(huì)相對(duì)密集并以某種趨勢(shì)呈現(xiàn)。數(shù)據(jù)的相關(guān)關(guān)系主要分為：正相關(guān)（兩個(gè)變量值同時(shí)增長(zhǎng)）、負(fù)相關(guān)（一個(gè)變量值增加另一個(gè)變量值下降）、不相關(guān)、線性相關(guān)、指數(shù)相關(guān)、U型相關(guān)等，表現(xiàn)在散點(diǎn)圖上的大致分布如圖4-1所示。那些離點(diǎn)集群較遠(yuǎn)的點(diǎn)則稱為離群點(diǎn)或者異常點(diǎn)。4.1.1繪制散點(diǎn)圖4.1.1繪制散點(diǎn)圖-1:基本散點(diǎn)圖4.1.1繪制散點(diǎn)圖-1:基本散點(diǎn)圖4.1.1繪制散點(diǎn)圖-1:基本散點(diǎn)圖基本散點(diǎn)圖可用于觀察兩個(gè)指標(biāo)的關(guān)系。上述代碼4-1，觀察身高和體重兩者間的關(guān)系。數(shù)據(jù)data是個(gè)二維數(shù)組，二維數(shù)組中的每個(gè)元素表示某人的身高和體重。其中第一個(gè)數(shù)組[167.0,64.6]，分別表示某人的身高為167.0cm和體重為64.6kg；由于在代碼中標(biāo)識(shí)了type:‘scatter’，ECharts會(huì)自動(dòng)從這個(gè)數(shù)組中的第一個(gè)元素中的第一個(gè)值167.0作為橫坐標(biāo)值，讀取這個(gè)數(shù)組的第一個(gè)元素的第二個(gè)值64.6作為縱坐標(biāo)值。代碼4-1運(yùn)行結(jié)果如圖4-2所示。從圖中可以看出，身高與體重基本上呈現(xiàn)出一種正相關(guān)的關(guān)系，即身高越高，體重也相應(yīng)增加。另外，還可以發(fā)現(xiàn)，身高主要集中在1.62米至1.72米之間。4.1.1繪制散點(diǎn)圖-2:兩個(gè)序列的散點(diǎn)圖與上一個(gè)實(shí)例不同，下面的實(shí)例在series中提供了兩組數(shù)據(jù)，分別代表兩個(gè)序列的數(shù)據(jù)：男和女的身高和體重；在EChats2.7中，自動(dòng)以兩個(gè)不同的標(biāo)識(shí)圖形來(lái)表示男和女不同序列的數(shù)據(jù)，這在黑白印刷品中容易區(qū)分；較好；在EChats4.x中，自動(dòng)以兩種不同顏色來(lái)表示男和女不同序列的數(shù)據(jù)，在黑白印刷品中不容易區(qū)分，不太好。可以修改symbol屬性來(lái)改變標(biāo)記圖形。4.1.1繪制散點(diǎn)圖-2:兩個(gè)序列的散點(diǎn)圖4.1.1繪制散點(diǎn)圖-2:兩個(gè)序列的散點(diǎn)圖4.1.1繪制散點(diǎn)圖-2:兩個(gè)序列的散點(diǎn)圖ECharts2.7中:5.1.1繪制散點(diǎn)圖-2:兩個(gè)序列的散點(diǎn)圖最新的ECharts5.3中:4.1.1繪制散點(diǎn)圖-3:帶漣漪特效的散點(diǎn)圖通過(guò)設(shè)置type的值為effectScatter可以設(shè)置帶有漣漪特效動(dòng)畫(huà)的ECharts散點(diǎn)圖（氣泡圖）。利用動(dòng)畫(huà)特效可以將某些想要突出的數(shù)據(jù)進(jìn)行視覺(jué)突出。4.1.1繪制散點(diǎn)圖-3:帶漣漪特效的散點(diǎn)圖4.1.1繪制散點(diǎn)圖-3:帶漣漪特效的散點(diǎn)圖4.1.2繪制氣泡圖上一小節(jié)介紹的散點(diǎn)圖，只有2個(gè)變量：身高和體重。如果想要增加一個(gè)變量？比如說(shuō)年齡，就可以用點(diǎn)的大小來(lái)表示年齡，這就變成了有大有小的點(diǎn)，像氣泡一樣，所以叫氣泡圖（bubble）。氣泡圖在基礎(chǔ)散點(diǎn)圖上添加一個(gè)維度：用氣泡大小表示一個(gè)新的維度。氣泡圖與散點(diǎn)圖最直觀的區(qū)別在于：散點(diǎn)圖中的數(shù)據(jù)點(diǎn)長(zhǎng)得都大小一樣；氣泡圖中的氣泡卻大小各不相同。4.1.2繪制氣泡圖-1:繪制標(biāo)準(zhǔn)氣泡圖標(biāo)準(zhǔn)氣泡圖可用于觀察三個(gè)指標(biāo)的關(guān)系。在代碼4-4的實(shí)例中，共有兩組氣泡數(shù)組bubble1和bubble2。每組氣泡數(shù)組中有100個(gè)元素，數(shù)組中每個(gè)元素具有三個(gè)數(shù)值，這三個(gè)數(shù)值是由系統(tǒng)使用隨機(jī)函數(shù)自動(dòng)生成的；元素的前兩個(gè)值為范圍在（-90，90）之間的隨機(jī)數(shù)，用于表示數(shù)據(jù)的位置；元素的第三個(gè)值是范圍在[0，90）之間的隨機(jī)數(shù)，用于表示氣泡的大小。4.1.2繪制氣泡圖-1:繪制標(biāo)準(zhǔn)氣泡圖4.1.2繪制氣泡圖-1:繪制標(biāo)準(zhǔn)氣泡圖4.1.2繪制氣泡圖-1:繪制標(biāo)準(zhǔn)氣泡圖4.1.2繪制氣泡圖-1:繪制標(biāo)準(zhǔn)氣泡圖標(biāo)準(zhǔn)氣泡圖可用于觀察三個(gè)指標(biāo)的關(guān)系。在代碼4-4的實(shí)例中，共有兩組氣泡數(shù)組bubble1和bubble2。每組氣泡數(shù)組中有100個(gè)元素，數(shù)組中每個(gè)元素具有三個(gè)數(shù)值，這三個(gè)數(shù)值是由系統(tǒng)使用隨機(jī)函數(shù)自動(dòng)生成的；元素的前兩個(gè)值為范圍在（-90，90）之間的隨機(jī)數(shù)，用于表示數(shù)據(jù)的位置；元素的第三個(gè)值是范圍在[0，90）之間的隨機(jī)數(shù)，用于表示氣泡的大小。4.1.2繪制氣泡圖-2:繪制各國(guó)人均壽命與GDP氣泡圖代碼4-5繪制1990和2015年各國(guó)人均壽命與GDP氣泡圖，圖中的橫坐標(biāo)表示人均GDP，縱坐標(biāo)表示人均壽命，圓圈的大小表示該國(guó)的人口數(shù)量。代碼中的每一組數(shù)據(jù)的各個(gè)元素的含義為：[人均GDP，人均壽命，總?cè)丝冢瑖?guó)家名稱，年份]；代碼能自動(dòng)利用數(shù)據(jù)每個(gè)元素中的前兩項(xiàng)來(lái)表示每個(gè)圓圈中心點(diǎn)的坐標(biāo)位置，即該點(diǎn)的橫坐標(biāo)、縱坐標(biāo)；圓圈的大小由第三個(gè)數(shù)據(jù)（總?cè)丝冢Q算后來(lái)表示。當(dāng)鼠標(biāo)指向圖中某個(gè)圓圈時(shí)，就會(huì)在圓圈上部，顯示這個(gè)圓圈所代表的國(guó)家和所對(duì)應(yīng)的年份。4.1.2繪制氣泡圖-2:繪制各國(guó)人均壽命與GDP氣泡圖4.1.2繪制氣泡圖-2:繪制各國(guó)人均壽命與GDP氣泡圖4.1.2繪制氣泡圖-2:繪制各國(guó)人均壽命與GDP氣泡圖4.1.2繪制氣泡圖-2:繪制各國(guó)人均壽命與GDP氣泡圖課程思政

經(jīng)濟(jì)發(fā)展的根本目的之一是改善生活質(zhì)量，提高百姓的平均壽命，值得驕傲的是，中國(guó)人均壽命從1949年的35歲，提高到2022年的78歲。人的壽命提高有賴于社會(huì)經(jīng)濟(jì)條件、衛(wèi)生醫(yī)療水平、個(gè)人體質(zhì)、遺傳因素、個(gè)人生活方式、氣候環(huán)境等因素。新中國(guó)成立以來(lái)，我國(guó)人民生活、醫(yī)療越來(lái)越有保障，人民生活越來(lái)越幸福，人均壽命就越來(lái)越長(zhǎng)了。人均壽命作為衡量經(jīng)濟(jì)社會(huì)發(fā)展水平和醫(yī)療衛(wèi)生服務(wù)水平的綜合指標(biāo)，在七十三年間實(shí)現(xiàn)了巨大跨越。這充分體現(xiàn)了社會(huì)主義制度的優(yōu)越性。4.1.2繪制氣泡圖-3:繪制北上廣三城市空氣污染指數(shù)氣泡圖代碼4-6繪制了北京、上海、廣州三個(gè)城市空氣污染指數(shù)的氣泡圖。圖4-7中的橫坐標(biāo)表示當(dāng)月的日期，縱坐標(biāo)表示AQI指數(shù)，圓圈的大小表示當(dāng)天的PM2.5的值。代碼中的每一組數(shù)據(jù)的各個(gè)元素的含義為：[日期，AQI指數(shù)，PM2.5，PM10，一氧化碳（CO），二氧化氮（NO2），二氧化硫（SO2）]；代碼能自動(dòng)利用數(shù)據(jù)每個(gè)元素中的前兩項(xiàng)來(lái)表示每個(gè)圓圈中心點(diǎn)的坐標(biāo)位置，即該點(diǎn)的橫坐標(biāo)、縱坐標(biāo)，圓圈的大小由第三個(gè)數(shù)據(jù)（PM2.5）來(lái)表示。當(dāng)鼠標(biāo)指向圖4-7中的某個(gè)圓圈時(shí)，就會(huì)顯示這個(gè)城市當(dāng)天的空氣污染指數(shù)的各種不同的數(shù)值。4.1.2繪制氣泡圖-3:繪制北上廣三城市空氣污染指數(shù)氣泡圖代碼5?6運(yùn)行結(jié)果如圖4-7所示。在代碼4-6中，介紹了另一個(gè)較為復(fù)雜的組件：視覺(jué)映射組件visualMap。它用于進(jìn)行“視覺(jué)編碼”，也就是將數(shù)據(jù)映射到視覺(jué)元素。視覺(jué)元素可以是：symbol:圖元的圖形類別；symbolSize:圖元的大??；color:圖元的顏色；colorAlpha:圖元的顏色的透明度；opacity:圖元以及其附屬物（如文字標(biāo)簽）的透明度等。4.1.2繪制氣泡圖-3:繪制北上廣三城市空氣污染指數(shù)氣泡圖4.1.2繪制氣泡圖-2:繪制各國(guó)人均壽命與GDP氣泡圖4.1.2繪制氣泡圖-3:繪制北上廣三城市空氣污染指數(shù)氣泡圖4.1.2繪制氣泡圖-3:繪制北上廣三城市空氣污染指數(shù)氣泡圖4.1.2繪制氣泡圖-3:繪制北上廣三城市空氣污染指數(shù)氣泡圖4.1.2繪制氣泡圖-3:繪制北上廣三城市空氣污染指數(shù)氣泡圖4.1.2繪制氣泡圖-3:繪制北上廣三城市空氣污染指數(shù)氣泡圖4.1繪制散點(diǎn)圖、氣泡圖散點(diǎn)圖、氣泡圖小結(jié)1、散點(diǎn)圖適用于研究大規(guī)模數(shù)據(jù)中兩個(gè)變量之間的相關(guān)關(guān)系；2、氣泡圖可用于研究展示三個(gè)變量之間的關(guān)系。1目錄繪制散點(diǎn)圖、氣泡圖繪制儀表盤(pán)2繪制漏斗圖（或金字塔）3繪制雷達(dá)圖詞、云圖和矩形樹(shù)圖44.2繪制儀表盤(pán)儀表盤(pán)（Gauge）也被稱為撥號(hào)圖表或速度表圖。它顯示類似于撥號(hào)/速度計(jì)上的讀數(shù)的數(shù)據(jù)，是一種擬物化的展示形式。儀表盤(pán)與漏斗圖是常用的商業(yè)BI類（商業(yè)智能：BusinessIntelligence）的圖表。儀表盤(pán)可以輕松展示用戶的數(shù)據(jù)，清晰的看出某個(gè)指標(biāo)值所在的范圍，儀表盤(pán)形式的報(bào)表應(yīng)用在各種統(tǒng)計(jì)系統(tǒng)中。本節(jié)結(jié)合實(shí)例，講解如何使用ECharts技術(shù)制作儀表盤(pán)。4.2.1繪制單儀表盤(pán)儀表盤(pán)使用顏色來(lái)劃分指示值的類別、使用刻度標(biāo)示數(shù)據(jù)、指針指示維度、指針角度表示數(shù)值。儀表盤(pán)只需分配最小值和最大值，并定義一個(gè)顏色范圍，指針將顯示出關(guān)鍵指標(biāo)的數(shù)據(jù)或當(dāng)前進(jìn)度。儀表盤(pán)可應(yīng)用于諸如速度、體積、溫度、進(jìn)度、完成率、滿意度等。代碼4-7的實(shí)例，是一個(gè)單儀表盤(pán)。每段代碼最后一段，使用setInterval(function()，每間隔2秒重新渲染一次，以實(shí)現(xiàn)動(dòng)態(tài)的效果。4.2.1繪制單儀表盤(pán)4.2.1繪制單儀表盤(pán)4.2.1繪制單儀表盤(pán)4.2.1繪制單儀表盤(pán)4.2.1繪制單儀表盤(pán)4.2.1繪制單儀表盤(pán)—作業(yè)1的效果圖4.2.2繪制多儀表盤(pán)如果想要同時(shí)表現(xiàn)幾類不同的事物的情況呢？比如，同時(shí)查看汽車的速度、發(fā)動(dòng)機(jī)的轉(zhuǎn)速、油表和水表的現(xiàn)狀。代碼4-8演示了多儀表盤(pán)。它共有四種不同的儀表盤(pán)：左邊為轉(zhuǎn)速儀表盤(pán)、中間為車速儀表盤(pán)、右邊并列的兩個(gè)：油表儀表盤(pán)和水表儀表盤(pán)。其中每個(gè)儀表盤(pán)的紅色區(qū)域提示可能出現(xiàn)的危險(xiǎn)情況，變動(dòng)的指針與下方隨之變動(dòng)的數(shù)字同時(shí)指示出當(dāng)前儀表盤(pán)的數(shù)值。在ECharts的多儀表盤(pán)代碼中，通過(guò)center:['xx%','yy%']來(lái)指定每個(gè)儀表盤(pán)中心點(diǎn)的位置，通過(guò)startAngle:xx,endAngle:yy來(lái)指定每個(gè)儀表盤(pán)的大小。最后一段，也使用了一個(gè)setInterval(function()，每間隔2秒重新渲染一次，以實(shí)現(xiàn)動(dòng)態(tài)效果。4.2.2繪制多儀表盤(pán)4.2.2繪制多儀表盤(pán)4.2.2繪制多儀表盤(pán)4.2.2繪制多儀表盤(pán)4.2.2繪制多儀表盤(pán)4.2.2繪制多儀表盤(pán)—作業(yè)2效果圖4.2儀表盤(pán)小結(jié)儀表盤(pán)非常適合在量化情況下顯示單一的價(jià)值和衡量標(biāo)準(zhǔn)，不適合用于比較不同變量或者趨勢(shì)的分析。儀表盤(pán)上可以同時(shí)展示不同維度的數(shù)據(jù)，但是為了避免指針的重疊影響數(shù)據(jù)的查看，并且基于常識(shí)，儀表盤(pán)的指針數(shù)量建議最多不要超過(guò)3根。如果確實(shí)有多個(gè)數(shù)據(jù)需要展示，建議使用多個(gè)儀表盤(pán)。1繪制儀表盤(pán)目錄繪制散點(diǎn)圖、氣泡圖2繪制漏斗圖（或金字塔）3繪制雷達(dá)圖詞、云圖和矩形樹(shù)圖44.3繪制漏斗圖（或金字塔）漏斗圖（funnel）（或金字塔pyramid）是一個(gè)倒（正）三角形的條形圖，它適用于業(yè)務(wù)流程比較規(guī)范、周期較長(zhǎng)、環(huán)節(jié)較多的流程分析。通過(guò)漏斗圖（或金字塔）對(duì)各環(huán)節(jié)業(yè)務(wù)數(shù)據(jù)進(jìn)行比較，能夠直觀地發(fā)現(xiàn)和說(shuō)明問(wèn)題，可以通過(guò)漏斗圖（或金字塔）分析各業(yè)務(wù)環(huán)節(jié)中哪些環(huán)節(jié)出了問(wèn)題。漏斗圖與儀表盤(pán)一樣，都是常用的商業(yè)BI類圖表。本節(jié)通過(guò)實(shí)例，介紹如何使用ECharts來(lái)繪建漏斗圖（或金字塔）。4.3.1繪制標(biāo)準(zhǔn)漏斗圖（或金字塔）漏斗圖又叫倒三角圖，漏斗圖將數(shù)據(jù)呈現(xiàn)為幾個(gè)階段，每個(gè)階段的數(shù)據(jù)都是整體的一部分，從一個(gè)階段到另一個(gè)階段數(shù)據(jù)自上而下逐漸下降，所有階段的占比總計(jì)100％。與餅圖一樣，漏斗圖呈現(xiàn)的也不是具體的數(shù)據(jù)，而是該數(shù)據(jù)相對(duì)于總數(shù)的占比、漏斗圖不需要使用任何數(shù)據(jù)軸。以電商網(wǎng)站數(shù)據(jù)為例，一個(gè)完整的網(wǎng)上購(gòu)物步驟大致可分為：瀏覽網(wǎng)站選購(gòu)商品→添進(jìn)購(gòu)物車→購(gòu)物結(jié)算→核對(duì)訂單信息→提交訂單→選擇支付方式→完成支付。漏斗圖能直觀地展現(xiàn)從最初“瀏覽網(wǎng)站選購(gòu)商品”到最終“完成支付”整個(gè)流程的轉(zhuǎn)化狀況。它不僅能展示用戶從“瀏覽網(wǎng)站選購(gòu)商品”到“完成支付”的最終轉(zhuǎn)化率，還可展示每個(gè)步驟的轉(zhuǎn)化率，能夠直觀地展示和說(shuō)明問(wèn)題所在，進(jìn)而能針對(duì)性地通過(guò)各階段的轉(zhuǎn)化分析去改善設(shè)計(jì)。4.3.1繪制標(biāo)準(zhǔn)漏斗圖（或金字塔）4.3.1繪制標(biāo)準(zhǔn)漏斗圖（或金字塔）漏斗圖與金字塔的差別，只在于數(shù)據(jù)系列的排列順序（由sort屬性來(lái)決定）的不同，當(dāng)把圖表配置項(xiàng)中的

series中的sort的取值由'descending'改為'ascending'時(shí)，就由漏斗圖變?yōu)榻鹱炙?.3.1繪制標(biāo)準(zhǔn)漏斗圖（或金字塔）4.3.1繪制標(biāo)準(zhǔn)漏斗圖（或金字塔）4.3.1繪制標(biāo)準(zhǔn)漏斗圖（或金字塔）4.3.1繪制標(biāo)準(zhǔn)漏斗圖（或金字塔）4.3.2繪制多漏斗圖（多金字塔）標(biāo)準(zhǔn)漏斗圖（金字塔圖），比較簡(jiǎn)單，單一的漏斗圖反映的數(shù)據(jù)過(guò)于單一，無(wú)法比較，有時(shí)也就失去了分析的意義。例如，可以對(duì)于用戶購(gòu)買流程，通過(guò)把流程優(yōu)化前后的漏斗圖放在一起，進(jìn)行比較分析，得出相關(guān)結(jié)論。代碼4-10演示了如何在ECharts中繪制多漏斗圖和多金字塔。設(shè)置圖表配置項(xiàng)中series中的sort的取值為'descending'或'ascending'時(shí)，分別指定圖表為漏斗圖或金字塔；通過(guò)設(shè)置圖表配置項(xiàng)中的屬性series中的left:'xx%',top:'yy%'為不同的值，來(lái)改變漏斗圖或金字塔的顯示位置。4.3.2繪制多漏斗圖（多金字塔）4.3.2繪制多漏斗圖（多金字塔）4.3.2繪制多漏斗圖（多金字塔）4.3.2漏斗圖（金字塔）小結(jié)漏斗圖適用于業(yè)務(wù)流程比較規(guī)范、周期較長(zhǎng)、環(huán)節(jié)較多的流程分析。漏斗圖并不是表示各個(gè)分類的占比情況，而是展示數(shù)據(jù)變化的一個(gè)邏輯流程。如果數(shù)據(jù)是無(wú)邏輯順序的占比比較，使用餅圖更合適。根據(jù)數(shù)據(jù)選擇使用對(duì)比色或同一種顏色的色調(diào)漸變，從最暗到最淺來(lái)依照漏斗尺寸排列。添加過(guò)多的圖層和顏色會(huì)造成漏斗圖難以閱讀。1繪制儀表盤(pán)目錄繪制散點(diǎn)圖、氣泡圖2繪制漏斗圖（或金字塔）3繪制雷達(dá)圖詞、云圖和矩形樹(shù)圖44.4繪制雷達(dá)圖和詞云圖雷達(dá)圖（radar）又叫戴布拉圖、蜘蛛網(wǎng)圖、蜘蛛圖，適用于顯示三個(gè)或更多的維度的變量，例如學(xué)生的各科成績(jī)分析。雷達(dá)圖對(duì)于查看哪些變量具有相似的值、變量之間是否有異常值都很有用。雷達(dá)圖表也可用于查看哪些變量在數(shù)據(jù)集內(nèi)得分較高或較低，因此非常適合性能分析。詞云圖，對(duì)文本中出現(xiàn)頻率較高的“關(guān)鍵詞”予以視覺(jué)化的展現(xiàn)，詞云圖可以過(guò)濾掉大量的低頻低質(zhì)的文本信息，使得瀏覽者只要一眼掃過(guò)文本就可領(lǐng)略文本的主旨。詞云圖對(duì)于產(chǎn)品排名、熱點(diǎn)問(wèn)題或輿情監(jiān)測(cè)是十分有幫助的。4.4.1繪制雷達(dá)圖-1:基本雷達(dá)圖雷達(dá)圖亦稱綜合財(cái)務(wù)比率分析圖法，最初是日本企業(yè)界對(duì)綜合實(shí)力進(jìn)行評(píng)估而采用的一種財(cái)務(wù)狀況綜合評(píng)價(jià)方法。按這種方法所繪制的財(cái)務(wù)比率綜合圖狀似雷達(dá)，故得此名。雷達(dá)圖將多個(gè)維度的數(shù)據(jù)映射到坐標(biāo)軸上，這些坐標(biāo)軸起始于同一個(gè)圓心點(diǎn)，通常結(jié)束于圓周邊緣，將同一組的點(diǎn)使用線連接起來(lái)就成為了雷達(dá)圖。雷達(dá)圖把縱向和橫向的分析比較方法結(jié)合起來(lái)，可以展示出數(shù)據(jù)集中各個(gè)變量的權(quán)重高低情況，非常適用于展示性能數(shù)據(jù)。雷達(dá)圖對(duì)于查看哪些變量具有相似的值、變量之間是否有異常值都很有用。雷達(dá)圖常用于排名、評(píng)估、評(píng)論等數(shù)據(jù)展示。設(shè)置圖表配置項(xiàng)中series中的type:'radar'，來(lái)指定圖表為雷達(dá)圖；通過(guò)設(shè)置圖表配置項(xiàng)中的屬性radar中的center:['xx%',top:'yy%']和radius:zz的值，來(lái)指定雷達(dá)圖的位置。4.4.1繪制雷達(dá)圖-1:基本雷達(dá)圖4.4.1繪制雷達(dá)圖-1:基本雷達(dá)圖4.4.1繪制雷達(dá)圖-1:基本雷達(dá)圖4.4.1繪制雷達(dá)圖-1:基本雷達(dá)圖4.4.1繪制雷達(dá)圖-1:基本雷達(dá)圖4.4.1繪制雷達(dá)圖-2:復(fù)雜雷達(dá)圖復(fù)雜的雷達(dá)圖（蜘蛛網(wǎng)圖）。復(fù)雜雷達(dá)圖中，顯示了各個(gè)瀏覽器占比的預(yù)測(cè)。在代碼4-12中，增加了一個(gè)visualMap（視覺(jué)映射組件），即把數(shù)據(jù)的哪個(gè)維度映射到什么視覺(jué)元素上。另外，代碼4-12也增加了一個(gè)滾動(dòng)圖例。4.4.1繪制雷達(dá)圖-2:復(fù)雜雷達(dá)圖4.4.1繪制雷達(dá)圖-2:復(fù)雜雷達(dá)圖4.4.1繪制雷達(dá)圖-2:復(fù)雜雷達(dá)圖4.4.1繪制雷達(dá)圖-2:復(fù)雜雷達(dá)圖多雷達(dá)圖中：通過(guò)屬性：center:[‘xx%’,‘yy%’]，來(lái)指定每個(gè)雷達(dá)圖的位置；通過(guò)屬性：

radius:zz，來(lái)指定每個(gè)雷達(dá)圖大??；其它屬性的設(shè)置與基本雷達(dá)圖是一致的。4.4.1繪制雷達(dá)圖-3:多雷達(dá)圖4.4.1繪制雷達(dá)圖-3:多雷達(dá)圖4.4.1繪制雷達(dá)圖-3:多雷達(dá)圖4.4.1繪制雷達(dá)圖-3:多雷達(dá)圖4.4.1繪制雷達(dá)圖-小結(jié)一個(gè)雷達(dá)圖包含的多邊形數(shù)量是有限的，如果有五個(gè)以上要評(píng)估的事物，無(wú)論是輪廓還是填充區(qū)域，都會(huì)產(chǎn)生覆蓋和混亂，使得數(shù)據(jù)難以閱讀。變量太多，會(huì)產(chǎn)生太多的軸，也會(huì)使圖表混亂，要保持雷達(dá)圖的簡(jiǎn)單并限制其變量數(shù)量。由于徑向距離很難判斷，雖然有網(wǎng)格線的參考，但是還是很難直觀的比較圖表內(nèi)變量具體的值，如果需要比較具體的值，建議使用折線圖。4.4.2繪制詞云圖-1-詞云圖詞云圖，也叫文字云?！霸~云”最初由美國(guó)西北大學(xué)新聞學(xué)副教授、新媒體專業(yè)主任里奇·戈登（RichGordon）提出的。詞云圖可以對(duì)一個(gè)網(wǎng)頁(yè)或者一篇文章進(jìn)行語(yǔ)義分析，也就是分析同一篇文章中或者同一網(wǎng)頁(yè)中關(guān)鍵詞出現(xiàn)的頻率。詞云圖對(duì)于產(chǎn)品排名、熱點(diǎn)問(wèn)題或輿情監(jiān)測(cè)是十分有幫助的。在ECharts3.0之后，移除了詞云圖，將它作為了擴(kuò)展插件?？稍诠倬W(wǎng)下載到對(duì)應(yīng)的詞云圖插件。如果需要進(jìn)行詞云圖開(kāi)發(fā)的話，首先需要到官網(wǎng)下載詞云圖插件，再引入echarts.js文件；或者可通過(guò)如下鏈接：http://echarts./build/dist/echarts.js，然后再通過(guò)命令引入wordCloud.js文件。4.4.2繪制詞云圖-1-詞云圖代碼4-14運(yùn)行結(jié)果如圖4-16所示。從代碼中可以看出，每個(gè)詞有一個(gè)值（value），排名前五的Java，C，Python，C++，C#的值依次為：16884，16180，9089，6229，3860；從詞云圖中可以看出，Java，C，Python，C++，C#的字號(hào)也會(huì)依據(jù)value值的大小，在詞云圖中呈現(xiàn)出來(lái)不同的大小。另外，createRandomItemStyle()為一個(gè)創(chuàng)建隨機(jī)樣式函數(shù)，該函數(shù)通過(guò)隨機(jī)函數(shù)產(chǎn)生RGB的三原色，從而能合成為一個(gè)隨機(jī)的顏色，在具體的數(shù)據(jù)（data