前幾日買(mǎi)回來(lái)《R語(yǔ)言數(shù)據(jù)可視化之美：專(zhuān)業(yè)圖表繪制指南（增強(qiáng)版）》，看到作者張杰在“增強(qiáng)版特別說(shuō)明”里專(zhuān)門(mén)提到了地圖繪制時(shí)需嚴(yán)格執(zhí)行各種規(guī)定，否則無(wú)法通過(guò)審核程序。我買(mǎi)到的是增強(qiáng)版，而該書(shū)這之前的版本中，作者為通過(guò)審核計(jì)沒(méi)有收入地圖繪制的內(nèi)容。如早些時(shí)候的2019第23周：評(píng)《R語(yǔ)言數(shù)據(jù)可視化之美：專(zhuān)業(yè)圖表繪制指南》文中就提到該書(shū)最新出版的版本中缺少了空間數(shù)據(jù)可視化部分內(nèi)容。
說(shuō)起來(lái)由于地圖引發(fā)的各種爭(zhēng)議也不在少數(shù)，也因此利用ECharts繪制地圖應(yīng)該是可以省去大家不少這方面的麻煩。ECharts是最先由百度開(kāi)發(fā)的使用 JavaScript 實(shí)現(xiàn)的開(kāi)源可視化庫(kù)，其功能強(qiáng)大、交互豐富，直觀且好用。盡管百度公司在其它方面的口碑不怎么樣，但Echart絕對(duì)算得上是Baidu的良心之作了。
比如在Python for Data Analysis和前面提到的《R語(yǔ)言數(shù)據(jù)可視化之美：專(zhuān)業(yè)圖表繪制指南（增強(qiáng)版）》的教程中，介紹的都是R或者Python調(diào)用.shp格式的地圖的方法。這些方法中首先能找到的合適的.shp文件本就不易，辛辛苦苦生成了地圖也可能又不符合各種規(guī)定也說(shuō)不定。反正我試過(guò)了.shp的方法后，再換到ECharts來(lái)生成地圖后就再也不想去用.shp文件格式地圖了。
ECharts繪制動(dòng)態(tài)地圖實(shí)例
如題圖所示，仍然以國(guó)內(nèi)的LEED認(rèn)證項(xiàng)目統(tǒng)計(jì)數(shù)據(jù)為例，利用Echarts生成的動(dòng)態(tài)地圖以對(duì)比各省之間的項(xiàng)目數(shù)量，以及歷年的認(rèn)證項(xiàng)目數(shù)量增長(zhǎng)趨勢(shì)。
參照Echarts官方樣例中地圖，以及timeline 組件，就可以輕松得到上圖中的效果了。
Echarts的官方教程宣稱(chēng)5 分鐘上手 ECharts，事實(shí)上也確實(shí)如此。
在引入Echats之后，不管選用的是哪種類(lèi)型的圖標(biāo)，首先第一步就是定制視圖選項(xiàng)。包括標(biāo)題、配色、字體、視覺(jué)映射、工具條、懸浮顯示等等。
配置好選項(xiàng)后，接下來(lái)指定數(shù)據(jù)及圖標(biāo)類(lèi)型，就算大功告成了。
$.get("leedcn.json", function (data) {
/*
將json文件導(dǎo)入，數(shù)據(jù)格式：
timeline：[2005,2006,……2017,2018] //LEED統(tǒng)計(jì)年份數(shù)組
// 從2005-2018年，每年獲認(rèn)證的LEED項(xiàng)目數(shù)量數(shù)組
yearseries：[[{name:"北京",value:2}, …{name:"西藏",value:0}],
……
[{name:"北京",value:216}, …{name:"西藏",value:0}]]
//從2005-2018年，累加的各省LEED項(xiàng)目數(shù)量數(shù)組
totalseries：[[{name:"北京",value:2}, …{name:"西藏",value:0}],
……
[{name:"北京",value:216}, …{name:"西藏",value:0}]]
*/
// 解析json文本賦值給object
//cnDataset = eval('('+ data +')');
cnDataset = eval(data);
// 調(diào)用完成后將loading動(dòng)畫(huà)停止
myChart.hideLoading();
// debugger
// 按年份將數(shù)據(jù)賦值給地圖填色
for (var n = 0; n < cnDataset.timeline.length; n++) {
option.baseOption.timeline.data.push(cnDataset.timeline[n]);
option.options.push({
title: {
show: true,
'text': cnDataset.timeline[n] + ''
},
series: {
name: cnDataset.timeline[n],
type: 'map',
roam: false,
map: 'china',
data: cnDataset.totalseries[n],
}
});
}
myChart.setOption(option);
});
如代碼中所示，Echarts圖表中的圖表類(lèi)型和數(shù)據(jù)由series來(lái)指定，Echarts還支持多個(gè)series實(shí)現(xiàn)類(lèi)似讓Echarts幾年前一舉成名的百度人口遷徙大數(shù)據(jù)可視化之類(lèi)的更加炫酷的效果。下圖就是將餅圖和堆疊面積圖合體后的效果。但不論如何我始終覺(jué)得，利用ECharts來(lái)生成動(dòng)態(tài)地圖算得上是它的優(yōu)勢(shì)之一。
本文中的完整代碼參見(jiàn)LEED in China和LEED in China（version 2），最好的Echarts學(xué)習(xí)資源應(yīng)該說(shuō)是官方的教程和樣例，所以感興趣的同學(xué)不妨前往官網(wǎng)圍觀。Echarts的支持文檔完整詳細(xì)，還可以在Echarts官方樣例上在線修改并實(shí)時(shí)查看效果，真的是非常方便了。
包括Plotly和R中g(shù)ganimate等在內(nèi)的工具包都可以實(shí)現(xiàn)動(dòng)態(tài)圖表，但各路大神們?yōu)镋charts開(kāi)發(fā)了R語(yǔ)言和Python的API接口，由此也可見(jiàn)Echarts的江湖地位了。
地圖就說(shuō)到這了，等有空了再來(lái)試下把ECharts的動(dòng)態(tài)網(wǎng)頁(yè)插入的PPT中。
參考資料
- Echart教程
- "Life Expectancy and GDP"實(shí)例
- "Air Quality - Baidu Map"實(shí)例
- recharts: 百度ECharts 2的R語(yǔ)言接口
- pyecharts - A Python Echarts Plotting Library
- 如何用 R 繪制動(dòng)態(tài)統(tǒng)計(jì)圖？
- Python 可視化神器-Plotly Express
- Powerpoint的舊瓶裝上ECharts的新酒，讓你的年終總結(jié)PPT高大上起來(lái)——Web Viewer 與 WebBrowser對(duì)比
