大數(shù)據(jù)基礎(chǔ) 課件7-3 ECharts數(shù)據(jù)可視化

浙江經(jīng)貿(mào)職業(yè)技術(shù)學(xué)院大數(shù)據(jù)基礎(chǔ)Unit7《大數(shù)據(jù)基礎(chǔ)》.移動(dòng)商務(wù)營(yíng)銷課程群7.2.1ECharts數(shù)據(jù)可視化7.2可視化工具7.2.2PyECharts數(shù)據(jù)可視化7.2.3Matplotlib數(shù)據(jù)可視化數(shù)據(jù)可視化7.2.1ECharts數(shù)據(jù)可視化1Echarts簡(jiǎn)介ECharts已經(jīng)可以支持包括折線圖、柱狀圖、散點(diǎn)圖、K線圖、餅圖、雷達(dá)圖、地圖等圖表，同時(shí)提供標(biāo)題、圖例、值域、時(shí)間軸、工具箱等可交互組件，支持多圖表、組件的聯(lián)動(dòng)和混搭展現(xiàn)。

ECharts制作的圖表7.2.1ECharts數(shù)據(jù)可視化2數(shù)據(jù)可視化來源訪問(次)視頻廣告300搜索引擎1048郵件580聯(lián)盟廣告484……某網(wǎng)站訪問來源相關(guān)數(shù)據(jù)樣例

接下來，我們通過對(duì)某個(gè)網(wǎng)站的訪問來源相關(guān)的數(shù)據(jù)進(jìn)行可視化，來詳細(xì)介紹一下ECharts的使用方法。如右圖所示是這個(gè)網(wǎng)站的訪問來源的數(shù)據(jù)樣例。7.2.1ECharts數(shù)據(jù)可視化數(shù)據(jù)可視化展示在本例中，我們利用Echarts實(shí)現(xiàn)了某站點(diǎn)訪問來源的數(shù)據(jù)可視化展現(xiàn)，展現(xiàn)結(jié)果如上圖所示。7.2.1ECharts數(shù)據(jù)可視化數(shù)據(jù)可視化展示

點(diǎn)擊右側(cè)工具箱中的數(shù)據(jù)視圖按鈕，可以得到數(shù)據(jù)視圖頁面，展示效果如上圖所示。7.2.1ECharts數(shù)據(jù)可視化

vardom=

document.getElementById('container');varmyChart=echarts.init(dom,null,{renderer:'canvas',useDirtyRect:false});varoption;option={title:{text:'某站點(diǎn)訪問來源',subtext:'測(cè)試數(shù)據(jù)',left:'center'},tooltip:{trigger:'item'},

示例程序toolbox:{show:true,orient:'vertical',x:'right',y:'center',feature:{mark:{show:true},dataView:{show:true,readOnly:false}}},legend:{orient:'vertical',left:'left'},7.2.1ECharts數(shù)據(jù)可視化series:[{name:'訪問來源',type:'pie',radius:'50%',data:[{value:1048,name:'搜索引擎'},{value:735,name:'直接訪問'},{value:580,name:'郵件'},{value:484,name:'聯(lián)盟廣告'},{value:300,name:'視頻廣告'}],emphasis:{itemStyle:{shadowBlur:10,shadowOffsetX:0,shadowColor:'rgba(0,0,0,0.5)'}}}]};示例程序

if(option&&typeofoption==='object'){myChart.setOption(option);}window.