大數(shù)據(jù)技術(shù)及應(yīng)用-基于Python語(yǔ)言 習(xí)題解答：第9章 大數(shù)據(jù)可視化_第1頁(yè)
大數(shù)據(jù)技術(shù)及應(yīng)用-基于Python語(yǔ)言 習(xí)題解答：第9章 大數(shù)據(jù)可視化_第2頁(yè)
大數(shù)據(jù)技術(shù)及應(yīng)用-基于Python語(yǔ)言 習(xí)題解答：第9章 大數(shù)據(jù)可視化_第3頁(yè)
大數(shù)據(jù)技術(shù)及應(yīng)用-基于Python語(yǔ)言 習(xí)題解答：第9章 大數(shù)據(jù)可視化_第4頁(yè)
大數(shù)據(jù)技術(shù)及應(yīng)用-基于Python語(yǔ)言 習(xí)題解答：第9章 大數(shù)據(jù)可視化_第5頁(yè)
已閱讀5頁(yè)，還剩29頁(yè)未讀， 繼續(xù)免費(fèi)閱讀

下載本文檔

版權(quán)說(shuō)明：本文檔由用戶(hù)提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡(jiǎn)介

大數(shù)據(jù)技術(shù)與應(yīng)用圖9.37所示。圖STYLEREF1\s9.SEQ圖\*ARABIC\s137Matplotlib繪制泡泡圖示例Matplotlib繪圖的布局方法簡(jiǎn)介Matplotlib采用網(wǎng)格布局的方式，有以下幾種布局方法：（1）subplots()：簡(jiǎn)單網(wǎng)絡(luò)排列。（2）GridSpec()：復(fù)雜網(wǎng)格排列。（3）SubplotSpec()：為給定GridSpec中子圖指定位置。（4）subplot2grid()：類(lèi)似于subplot()，但使用基于0的索引并允許子圖占據(jù)多個(gè)單元格。這里介紹最常見(jiàn)的一種網(wǎng)格排版方法subplots()，該方法一次性定好所有Axes，示例代碼如下：#Matplotlib布局方法示例代碼frommatplotlibimportpyplotaspltfig=plt.figure(dpi=300)ax1=fig.add_subplot(2,2,1)ax2=fig.add_subplot(2,2,2)ax3=fig.add_subplot(2,2,3)ax4=fig.add_subplot(2,2,4)ax1.set_title("(1)")ax2.set_title("(2)")ax3.set_title("(3)")ax4.set_title("(4)")fig.tight_layout()#自動(dòng)緊湊布局plt.show()其中，add_subplot(2,2,x)語(yǔ)句表示生成2*2的四個(gè)子圖，呈現(xiàn)的效果如REF_Ref62462211\h圖9.38所示：圖STYLEREF1\s9.SEQ圖\*ARABIC\s138Matplotlib布局示意圖基于ECharts的可視化示例百度公司開(kāi)源的Apache項(xiàng)目ECharts（/zh/index.html），是一個(gè)純Javascript的數(shù)據(jù)可視化編程庫(kù)，可在Web端高度定制可視化圖表，提供多種類(lèi)型的圖表，并可以實(shí)現(xiàn)動(dòng)態(tài)交互功能，常應(yīng)用于軟件產(chǎn)品開(kāi)發(fā)或網(wǎng)頁(yè)的統(tǒng)計(jì)圖表模塊，還能結(jié)合百度地圖處理時(shí)空數(shù)據(jù)的可視化展現(xiàn)。REF_Ref65574820\h圖9.39是ECharts項(xiàng)目官網(wǎng)示意圖。圖STYLEREF1\s9.SEQ圖\*ARABIC\s139ECharts項(xiàng)目官網(wǎng)示意圖ECharts使用準(zhǔn)備獲取EChartsECharts是以JavaScripts庫(kù)提供的，可以通過(guò)以下幾種方式獲取ApacheECharts的發(fā)行版。從ECharts的

GitHub

（/apache/echarts/releases）上下載通過(guò)npm獲取echarts（npm版本需要大于3.0，如果低于此版本需要升級(jí)）npminstallecharts–save通過(guò)

jsDelivr

等CDN引入（/package/npm/echarts）還可以在ECharts的官網(wǎng)上直接下載更多豐富的版本，包含了不同主題跟語(yǔ)言，（下載地址：/zh/download.html），這些構(gòu)建好的echarts提供了下面這幾種定制版本：完全版：echarts/dist/echarts.js，體積最大，包含所有的圖表和組件，所包含內(nèi)容參見(jiàn)：echarts/echarts.all.js。常用版：echarts/dist/mon.js，體積適中，包含常見(jiàn)的圖表和組件，所包含內(nèi)容參見(jiàn)：echarts/mon.js。精簡(jiǎn)版：echarts/dist/echarts.simple.js，體積較小，僅包含最常用的圖表和組件，所包含內(nèi)容參見(jiàn)：echarts/echarts.simple.js。引入ECharts在HTML文件中使用Echarts的方法與普通的JavaScripts庫(kù)一樣，使用script標(biāo)簽引入。（1）第一步：創(chuàng)建HTML頁(yè)面文件創(chuàng)建一個(gè)HTML頁(yè)面文件，引入echarts.js文件。<!DOCTYPEhtml><html><head><metacharset="utf-8"><!--引入ECharts文件--><scriptsrc="echarts.js"></script></head></html>（2）第二步：為Echarts準(zhǔn)備一個(gè)DOM容器<body><!--為ECharts準(zhǔn)備一個(gè)具備大小（寬高）的DOM--><divid="main"style="width:600px;height:400px;"></div></body>這里為ECharts配置了

id為main的div（DOM容器）用于包含ECharts繪制的圖表。提示：每個(gè)DOM容器只能包含一個(gè)ECharts對(duì)象實(shí)例，如果要在同一個(gè)頁(yè)面中顯示多個(gè)ECharts的圖表則需要?jiǎng)?chuàng)建多個(gè)DOM容器。ECharts基礎(chǔ)概念概覽echarts實(shí)例一個(gè)網(wǎng)頁(yè)中可以創(chuàng)建多個(gè)

ECharts實(shí)例，每個(gè)

ECharts實(shí)例

中可以創(chuàng)建多個(gè)圖表和坐標(biāo)系等等（用

option

來(lái)描述）。準(zhǔn)備一個(gè)DOM節(jié)點(diǎn)（作為echarts的渲染容器），就可以在上面創(chuàng)建一個(gè)ECharts實(shí)例。每個(gè)ECharts實(shí)例獨(dú)占一個(gè)DOM節(jié)點(diǎn)。系列（series）ECharts里的系列（series）是指一組數(shù)值以及他們映射成的圖?！跋盗小边@個(gè)詞原本可能來(lái)源于“一系列的數(shù)據(jù)”，而在ECharts中取其擴(kuò)展的概念，不僅表示數(shù)據(jù)，也表示數(shù)據(jù)映射成為的圖。所以，一個(gè)

系列

包含的要素至少有：一組數(shù)值、圖表類(lèi)型（series.type）、以及其他的關(guān)于這些數(shù)據(jù)如何映射成圖的參數(shù)。組件（component）在系列之上，ECharts中各種內(nèi)容，被抽象為“組件”。例如，ECharts中至少有這些組件：xAxis（直角坐標(biāo)系X軸）、yAxis（直角坐標(biāo)系Y軸）、grid（直角坐標(biāo)系底板）、angleAxis（極坐標(biāo)系角度軸）、radiusAxis（極坐標(biāo)系半徑軸）、polar（極坐標(biāo)系底板）、geo（地理坐標(biāo)系）、dataZoom（數(shù)據(jù)區(qū)縮放組件）、visualMap（視覺(jué)映射組件）、tooltip（提示框組件）、toolbox（工具欄組件）、series（系列）、...。用option描述圖表ECharts的使用者可以使用

option

來(lái)描述其對(duì)圖表的各種需求，包括：有什么數(shù)據(jù)、要畫(huà)什么圖表、圖表長(zhǎng)什么樣子、含有什么組件、組件能操作什么事情等等。簡(jiǎn)而言之，option

表述了：數(shù)據(jù)、數(shù)據(jù)如何映射成圖形、交互行為。ECharts示例本節(jié)介紹幾種ECharts中最常見(jiàn)的圖表，包括柱狀圖和餅圖，以及如何異步加載數(shù)據(jù)的示例。為了在Web頁(yè)面上繪制圖形，需要在HTML的JavaScripts代碼段中完成三個(gè)步聚：用echarts.init

方法初始化一個(gè)echarts對(duì)象實(shí)例以json格式定義可視化圖表的數(shù)據(jù)格式用echarts對(duì)象實(shí)例的

setOption

方法繪制圖形柱狀圖示例本示例以柱狀圖顯示一個(gè)服裝類(lèi)商品銷(xiāo)量的對(duì)比圖，該示例文件ex7_1.html的源代碼如下：<!DOCTYPEhtml><html><head><metacharset="utf-8"><title>ECharts</title><!--引入echarts.js--><scriptsrc="echarts.js"></script></head><body><!--為ECharts準(zhǔn)備一個(gè)具備大?。▽捀撸┑腄om--><divid="main"style="width:600px;height:500px;"></div><scripttype="text/javascript">//基于準(zhǔn)備好的dom，初始化echarts實(shí)例varmyChart=echarts.init(document.getElementById('main'));//指定圖表的配置項(xiàng)和數(shù)據(jù)varoption={title:{text:'ECharts入門(mén)示例'},tooltip:{},legend:{data:['銷(xiāo)量']},xAxis:{data:["襯衫","羊毛衫","雪紡衫","褲子","高跟鞋","襪子"]},yAxis:{},series:[{name:'銷(xiāo)量',type:'bar',data:[5,20,36,10,10,20]}]};//使用剛指定的配置項(xiàng)和數(shù)據(jù)顯示圖表。myChart.setOption(option);</script></body></html>用瀏覽器打開(kāi)ex7_1.html文件，呈現(xiàn)的效果如REF_Ref62290397\h圖9.40所示。圖STYLEREF1\s9.SEQ圖\*ARABIC\s140ECharts柱狀圖示例代碼說(shuō)明：（1）本示例源碼中的varmyChart=echarts.init(document.getElementById('main'));表示將圖表顯示在ID為main的div層中。（2）代碼第21-23行option對(duì)象中的legend:{data:['銷(xiāo)量']}，定義了圖例的數(shù)據(jù)數(shù)組。數(shù)組項(xiàng)通常為一個(gè)字符串，每一項(xiàng)代表一個(gè)系列（series）的name。第22行的'銷(xiāo)量'即表示y軸顯示的數(shù)據(jù)為第28-32行所定義的數(shù)組（series）。（3）第30行的type:'bar'表示呈現(xiàn)圖表格式為柱狀圖，type屬性可定義的圖表類(lèi)型有以下幾種：type:'bar'：柱狀/條形圖type:'line'：折線(xiàn)/面積圖type:'pie'：餅圖type:'scatter'：散點(diǎn)（氣泡）圖type:'effectScatter'：帶有漣漪特效動(dòng)畫(huà)的散點(diǎn)（氣泡）type:'radar'：雷達(dá)圖type:'tree'：樹(shù)型圖type:'treemap'：樹(shù)型圖type:'sunburst'：旭日?qǐng)Dtype:'boxplot'：箱形圖type:'candlestick'：K線(xiàn)圖type:'heatmap'：熱力圖type:'map'：地圖type:'parallel'：平行坐標(biāo)系的系列type:'lines'：線(xiàn)圖type:'graph'：關(guān)系圖type:'sankey'：?；鶊Dtype:'funnel'：漏斗圖type:'gauge'：儀表盤(pán)type:'pictorialBar'：象形柱圖type:'themeRiver'：主題河流type:'custom'：自定義系列餅圖示例本例對(duì)上節(jié)的商品銷(xiāo)量數(shù)據(jù)值稍加修改，并以餅圖樣式呈現(xiàn)，顯示效果如REF_Ref62293975\h圖9.41所示。圖STYLEREF1\s9.SEQ圖\*ARABIC\s141ECharts餅圖示例該示例文件ex9_2.html的源代碼如下：<!DOCTYPEhtml><html><head><metacharset="utf-8"><title>ECharts餅圖實(shí)例</title><scriptsrc="echarts.js"></script></head><body><divid="main"style="width:600px;height:400px;"></div><scripttype="text/javascript">varmyChart=echarts.init(document.getElementById('main')); varoption={ title:{text:'商品銷(xiāo)量', left:'center'}, legend:{ orient:'vertical', left:'left', }, tooltip:{}, series:[{name:'商品銷(xiāo)量',type:'pie',//設(shè)置圖表類(lèi)型為餅圖radius:'55%',//餅圖的半徑，外半徑為可視區(qū)尺寸(容器高寬中較小一項(xiàng))的55%長(zhǎng)度。data:[//數(shù)據(jù)數(shù)組，name為數(shù)據(jù)項(xiàng)名稱(chēng)，value為數(shù)據(jù)項(xiàng)值{value:235,name:'襯衫'},{value:274,name:'羊毛衫'},{value:310,name:'雪紡衫'},{value:335,name:'褲子'},{value:400,name:'高跟鞋'}, {value:500,name:'襪子'}]}] }myChart.setOption(option);</script></body></html>ECharts異步加載數(shù)據(jù)上面的兩個(gè)例子中，圖表的數(shù)據(jù)直接設(shè)置在網(wǎng)頁(yè)文件中，通過(guò)echharts對(duì)象的setOption方法加載。但通常情況下，數(shù)據(jù)是從文件、數(shù)據(jù)庫(kù)或服務(wù)器端動(dòng)態(tài)獲取的，這就需要使用異步獲取數(shù)據(jù)方法。為了動(dòng)態(tài)加載數(shù)據(jù)，可以配合jQuery等工具，以異步方式獲取數(shù)據(jù)后通過(guò)ECharts對(duì)象的setOption方法填入數(shù)據(jù)和配置項(xiàng)。以下介紹ECharts與JQuery結(jié)合，從本地文件或服務(wù)端動(dòng)態(tài)獲取數(shù)據(jù)，實(shí)現(xiàn)異步獲取數(shù)據(jù)并顯示圖表的示例。（1）數(shù)據(jù)說(shuō)明假設(shè)數(shù)據(jù)文件（json數(shù)據(jù)格式）的名稱(chēng)為test_data.json，內(nèi)容如下：{

"data_PV"

:

[

{"value":235,

"name":"視頻廣告"},

{"value":274,

"name":"聯(lián)盟廣告"},

{"value":310,

"name":"郵件營(yíng)銷(xiāo)"},

{"value":335,

"name":"直接訪問(wèn)"},

{"value":400,

"name":"搜索引擎"}

]

}（2）JQuery的異步獲取數(shù)據(jù)方法JQuery是一個(gè)著名的JavaScript庫(kù)，用于操縱網(wǎng)頁(yè)中的文檔對(duì)象，以及從Web服務(wù)器異步獲取數(shù)據(jù)。網(wǎng)頁(yè)文件中引入JQuery壓縮版的jquery.min.js庫(kù)（從JQuery官網(wǎng)在線(xiàn)引入）：<scriptsrc="/jquery-3.5.1.min.js"></script>也可以預(yù)先下載jquery-3.5.1.min.js文件到本地，然后直接在網(wǎng)頁(yè)文件中引入：<scriptsrc="jquery-3.5.1.min.js"></script>JQuery的$.get()方法可以從本地獲取數(shù)據(jù)或使用HTTPGET請(qǐng)求從服務(wù)器獲取數(shù)據(jù)，語(yǔ)法為：$.get(URL,data,function(data,status,xhr),dataType)該方法的參數(shù)說(shuō)明在REF_Ref62461709\h表9.2中給出。表STYLEREF1\s9.SEQ表\*ARABIC\s12JQuery的$.get()方法的參數(shù)說(shuō)明參數(shù)描述URL必需。規(guī)定需要請(qǐng)求的URL。data可選。規(guī)定連同請(qǐng)求發(fā)送到服務(wù)器的數(shù)據(jù)。function(data,status,xhr)可選。規(guī)定當(dāng)請(qǐng)求成功時(shí)運(yùn)行的函數(shù)。額外的參數(shù)：data

-包含來(lái)自請(qǐng)求的結(jié)果數(shù)據(jù)status

-包含請(qǐng)求的狀態(tài)（"success"、"notmodified"、"error"、"timeout"、"parsererror"）xhr

-包含XMLHttpRequest對(duì)象dataType可選?？赡艿念?lèi)型："xml"-XML文檔"html"-HTML作為純文本"text"-純文本字符串"script"-以JavaScript運(yùn)行響應(yīng)，并以純文本返回"json"-以JSON運(yùn)行響應(yīng)，并以JavaScript對(duì)象返回"jsonp"-使用JSONP加載一個(gè)JSON塊，將添加一個(gè)"?callback=?"到URL來(lái)規(guī)定回調(diào)（3）實(shí)例代碼本實(shí)例從本地文件中獲取數(shù)據(jù)，用ECharts在網(wǎng)頁(yè)上呈現(xiàn)數(shù)據(jù)可視化圖表。首先創(chuàng)建test_data.json文件，保存在HTML文件ex7_3.html同一個(gè)目錄下。接著在ex7_3.html中引入JQuery庫(kù)，用JQuery的$.get方法獲取test_data.json中的數(shù)據(jù)，提交ECharts繪制圖表，源代碼如下：<!DOCTYPEhtml><html><head><metacharset="utf-8"><title>ECharts實(shí)例：異步加載數(shù)據(jù)</title><scriptsrc="jquery-3.5.1.min.js"></script> <scriptsrc="echarts.js"></script></head><body><divid="main"style="width:600px;height:500px;"></div><scripttype="text/javascript"> varmyChart=echarts.init(document.getElementById('main')); $.get('test_data.json',function(data){ myChart.setOption({ series:[ { name:'訪問(wèn)來(lái)源', type:'pie', roseType:'angle',//以南丁格爾玫瑰圖方式顯示餅圖 radius:'55%', data:data.data_PV } ] }) },'json')</script></body></html>在瀏覽器中打開(kāi)ex7_3.html文件，顯示的效果如REF_Ref62373054\h圖9.42所示。圖STYLEREF1\s9.SEQ圖\*ARABIC\s142異步加載數(shù)據(jù)以玫瑰圖樣式呈現(xiàn)提示：用某些瀏覽器打開(kāi)本示例的網(wǎng)頁(yè)文件無(wú)法呈現(xiàn)圖表（如谷歌的chrome瀏覽器），這是由于其默認(rèn)的安全限制不允許讀取本地文件。解決方法是設(shè)置chrome允許訪問(wèn)本地磁盤(pán)文件，

常用方法：右擊chrome的桌面快捷方式，選擇“屬性”，在“快捷方式”下的“目標(biāo)”中添加"--allow-file-access-from-files"（最前面有個(gè)空格），重啟chrome后即可。（4）從Web服務(wù)器上異步獲取數(shù)據(jù)如果數(shù)據(jù)是從Web服務(wù)器上異步獲取，則對(duì)ex7_3.html文件第13行進(jìn)行相應(yīng)修改，用某個(gè)URL代替'test_data.json'。本章小結(jié)本章首先介紹了數(shù)據(jù)可視化的常用方法和示例，以及目前常用的數(shù)據(jù)可視化工具的基本情況，接著介紹了使用Python語(yǔ)言的Matplotlib庫(kù)進(jìn)行數(shù)據(jù)可視化編程

溫馨提示

  • 1. 本站所有資源如無(wú)特殊說(shuō)明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶(hù)所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁(yè)內(nèi)容里面會(huì)有圖紙預(yù)覽，若沒(méi)有圖紙預(yù)覽就沒(méi)有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫(kù)網(wǎng)僅提供信息存儲(chǔ)空間，僅對(duì)用戶(hù)上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對(duì)用戶(hù)上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請(qǐng)與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶(hù)因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。

評(píng)論

0/150

提交評(píng)論