《大數(shù)據(jù)可視化技術(shù)》課件 第九章 平行坐標(biāo)圖_第1頁
《大數(shù)據(jù)可視化技術(shù)》課件 第九章 平行坐標(biāo)圖_第2頁
《大數(shù)據(jù)可視化技術(shù)》課件 第九章 平行坐標(biāo)圖_第3頁
《大數(shù)據(jù)可視化技術(shù)》課件 第九章 平行坐標(biāo)圖_第4頁
《大數(shù)據(jù)可視化技術(shù)》課件 第九章 平行坐標(biāo)圖_第5頁
已閱讀5頁,還剩28頁未讀 繼續(xù)免費閱讀

下載本文檔

版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進行舉報或認領(lǐng)

文檔簡介

第九章

平行坐標(biāo)圖GOAL學(xué)習(xí)目標(biāo)1了解平行坐標(biāo)圖的概念、特點和應(yīng)用場景2了解Echarts平行坐標(biāo)圖的核心組件及常用屬性3掌握Echarts平行坐標(biāo)系、平行坐標(biāo)軸組件的基本用法4掌握利用Web前端開發(fā)技術(shù)制作靜態(tài)平行坐標(biāo)圖的方法5掌握綜合利用Web前后端開發(fā)技術(shù)制作動態(tài)平行坐標(biāo)圖的方法目錄Contents9.1平行坐標(biāo)圖簡介9.2Echarts平行坐標(biāo)圖核心組件9.3靜態(tài)平行坐標(biāo)圖9.4動態(tài)平行坐標(biāo)圖9.1平行坐標(biāo)圖簡介

平行坐標(biāo)圖是一種展示高維數(shù)據(jù)的信息圖表。在平行坐標(biāo)圖中存在多條互相平行的坐標(biāo)軸,每條坐標(biāo)軸對應(yīng)一個數(shù)據(jù)維度,每條記錄則對應(yīng)一條貫穿所有坐標(biāo)軸的折線。折線的形態(tài)能夠反映記錄之間的關(guān)系,隨著數(shù)據(jù)量的增加,形態(tài)相似的折線會堆疊起來,形成聚類的效果,從而揭示出記錄之間的相關(guān)關(guān)系。9.1平行坐標(biāo)圖簡介9.1平行坐標(biāo)圖簡介平行坐標(biāo)圖示例9.2Echarts平行坐標(biāo)圖核心組件9.2.1數(shù)據(jù)系列組件屬性說明type圖表類型,設(shè)置為“parallel”(平行坐標(biāo)圖)lineStyle折線的樣式,包含若干子屬性smooth是否對折線進行平滑,可選項為“true”或“false”data數(shù)據(jù)體,結(jié)構(gòu)形如:“[['HD01',89.36,174.41,50.07,69.11,2.13,14.87,117,'輕度污染'],......]”Echarts平行坐標(biāo)圖數(shù)據(jù)系列組件常用屬性9.2.2平行坐標(biāo)系組件“parallelAxisDefault”的常用子屬性屬性說明nameLocation坐標(biāo)軸名稱顯示位置,可選項有:“start”,“center”和“end”。nameTextStyle坐標(biāo)軸名稱的文字樣式。nameGap坐標(biāo)軸名稱與軸線之間的距離。splitNumber坐標(biāo)軸的分割段數(shù)。axisLine坐標(biāo)軸軸線相關(guān)設(shè)置,包含若干子屬性。axisTick坐標(biāo)軸刻度相關(guān)設(shè)置,包含若干子屬性。axisLabel坐標(biāo)軸刻度標(biāo)簽的相關(guān)設(shè)置,包含若干子屬性。9.2.3平行坐標(biāo)軸組件平行坐標(biāo)軸組件的常用屬性屬性說明dim坐標(biāo)軸的維度序號,對應(yīng)數(shù)據(jù)體中的某一列。type坐標(biāo)軸類型,可選項有:“value”(數(shù)值軸),“category”(類目軸),“time”(時間軸)和“l(fā)og”(對數(shù)軸)。name坐標(biāo)軸的名稱。min坐標(biāo)軸刻度的最小值。max坐標(biāo)軸刻度的最大值。data數(shù)據(jù),在類目軸中有效。9.3靜態(tài)平行坐標(biāo)圖9.3.1準(zhǔn)備工作(1)創(chuàng)建項目目錄結(jié)構(gòu)9.3.1準(zhǔn)備工作(2)準(zhǔn)備HTML文檔<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metahttp-equiv="X-UA-Compatible"content="IE=edge"><metaname="viewport"content="width=device-width,initial-scale=1.0"><scriptsrc="JS/echarts.js"></script><linkrel="stylesheet"href="CSS/main.css"><title>空氣質(zhì)量指數(shù)平行坐標(biāo)圖</title></head><body><divid="parallel"></div><scriptsrc="JS/parallel.js"></script></body></html>9.3.1準(zhǔn)備工作(3)設(shè)置元素樣式body{background-color:black;}#parallel{position:absolute;left:15%;top:15%;width:70%;height:70%;}新建“main.css”5.2.1準(zhǔn)備工作(4)數(shù)據(jù)準(zhǔn)備監(jiān)測站代碼AQIAQI類別HD01117輕度污染XT01199中度污染HS01185中度污染SJZ01112輕度污染CZ01133輕度污染BD0195良LF0186良TS0189良QHD0156良ZJK0143優(yōu)CD0130優(yōu)9.3.1準(zhǔn)備工作(4)數(shù)據(jù)準(zhǔn)備[['HD01',89.36,174.41,50.07,69.11,2.13,14.87,117,'輕度污染'],['XT01',149.95,232.85,38.91,79.85,2.15,16.20,199,'中度污染'],['HS01',140.07,208.95,37.54,82.01,2.39,9.360,185,'中度污染'],['SJZ01',84.82,153.55,37.61,70.87,1.70,14.00,112,'輕度污染'],['CZ01',101.87,146.70,41.08,74.14,1.86,10.96,133,'輕度污染'],['BD01',71.02,124.90,32.03,71.96,1.97,13.78,95,'良'],['LF01',63.88,111.02,19.62,60.25,1.93,11.95,86,'良'],['TS01',66.33,120.00,35.72,48.16,2.05,18.82,89,'良'],['QHD01',30.39,63.15,27.47,36.12,1.13,24.97,56,'良'],['ZJK01',21.25,43.75,17.23,24.52,0.78,35.38,43,'優(yōu)'],['CD01',16.25,30.71,5.05,16.40,0.60,33.21,30,'優(yōu)']]title:{text:'空氣質(zhì)量指數(shù)平行坐標(biāo)圖',textStyle:{color:'lightgray',fontSize:28},subtext:'\n監(jiān)測時間:2018年1月1日',9.3.2圖表制作(1)標(biāo)題組件show:true,subtextStyle:{color:'lightgray',fontSize:20,},left:'center',},parallel:{bottom:'15%',top:'30%',parallelAxisDefault:{nameLocation:'end',nameTextStyle:{color:'lightgray',fontSize:20},9.3.2圖表制作(2)平行坐標(biāo)系組件nameGap:20,splitNumber:5,axisLine:{lineStyle:{color:'lightgray'},},axisTick:{lineStyle:{color:'lightgray'}},axisLabel:{color:'lightgray',fontSize:18}}},parallelAxis:[{dim:7,name:'AQI',min:0,max:250},9.3.2圖表制作(3)平行坐標(biāo)軸組件{dim:1,name:'PM2.5',min:0,max:200},{dim:3,name:'SO2',min:0,max:60},{dim:4,name:'NO2',min:0,max:100},{dim:2,name:'PM10',min:0,max:300},{dim:5,name:'CO',min:0,max:3},{dim:6,

name:'O3',min:0,max:40},9.3.2圖表制作(3)平行坐標(biāo)軸組件{dim:8,type:'category',name:'AQI類別',data:['優(yōu)','良','輕度污染','中度污染','重度污染','嚴(yán)重污染']}],visualMap:{type:'piecewise',dimension:7,pieces:[{min:0,max:50,color:'lime'},{min:51,max:100,color:'yellow'},{min:101,max:150,color:'orange'},{min:151,max:200,color:'red'},{min:201,max:300,color:'purple'},{min:300,color:'brown'}],9.3.2圖表制作(4)視覺映射組件orient:'horizontal',left:'center',bottom:'bottom',itemWidth:25,itemHeight:25,text:['AQIHigh','AQILow'],textStyle:{color:'lightgray',fontSize:18}},series:[{name:'AQI類別',type:'parallel',lineStyle:{width:3,opacity:0.7},smooth:true,

9.3.2圖表制作(5)數(shù)據(jù)系列組件data:[['HD01',89.36,174.41,50.07,69.11,2.13,14.87,117,'輕度污染'],......]},],9.3.3圖表展示使用瀏覽器打開“index.html”查看平行坐標(biāo)圖顯示效果

9.4動態(tài)平行坐標(biāo)圖9.4.1準(zhǔn)備工作創(chuàng)建項目目錄結(jié)構(gòu)9.4.2圖表制作(1)數(shù)據(jù)轉(zhuǎn)換編寫AQI計算模塊:新建“aqi.py”函數(shù)名稱返回值cal_iaqi(iaqi_h,iaqi_l,bp_h,bp_l,c_p)空氣質(zhì)量分指數(shù)。get_iaqi_pm25(value)PM2.5

濃度值對應(yīng)的空氣質(zhì)量分指數(shù)。get_iaqi_pm10(value)PM10

濃度值對應(yīng)的空氣質(zhì)量分指數(shù)。get_iaqi_so2(value)SO2

濃度值對應(yīng)的空氣質(zhì)量分指數(shù)。get_iaqi_no2(value)NO2濃度值對應(yīng)的空氣質(zhì)量分指數(shù)。get_iaqi_co(value)CO濃度值對應(yīng)的空氣質(zhì)量分指數(shù)。get_iaqi_o3(value)O3濃度值對應(yīng)的空氣質(zhì)量分指數(shù)。get_aqi(iaqis)空氣質(zhì)量指數(shù)。get_aqi_class(aqi)空氣質(zhì)量的類別。fromaqiimportget_aqi,get_aqi_classimportjsondefgetParallelJSON(data):newData=[]forstationindata:lst=[]foriteminstation:lst.append(item)9.4.2圖表制作(1)數(shù)據(jù)轉(zhuǎn)換組裝JSON字符串:修改“preprocess.py”aqi=get_aqi(lst[1:])aqi_class=get_aqi_class(aqi)lst.append(aqi)lst.append(aqi_class)newData.append(lst)dct={}dct['AQI']=newDatareturnjson.dumps(dct,ensure_ascii=False)9.4.2圖表制作(1)數(shù)據(jù)轉(zhuǎn)換發(fā)布JSON數(shù)據(jù)接口:添加視圖函數(shù)“json_for_parallel()”@app.route('/json_for_parallel')defjson_for_parallel():sql='''SELECTstation,pm25,pm10,so2,no2,co,o3FROMairpollutionWHEREDATE(date)='2018-01-01'AND(station='HD01'ORstation='XT01'ORstation='HS01'ORstation='SZJ01'ORstation='CZ01'ORstation='BD01'ORstation='LF01'OR

溫馨提示

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

評論

0/150

提交評論