今天虎哥給大家介紹個(gè)新工具，用于數(shù)據(jù)可視化祝旷，它是一個(gè)開源的插件，由JavaScript編寫并實(shí)現(xiàn)的嘶窄』初耍可以流暢的運(yùn)行在PC端和移動(dòng)端，兼容絕大部分瀏覽器柄冲。Echarts具有強(qiáng)大的交互性吻谋，官網(wǎng)：
https://www.echartsjs.com/index.html
Echarts的優(yōu)勢在于他是中國人開發(fā)的，所以有完善的中文文檔现横，非常方便閱讀和使用漓拾。
這個(gè)是Echarts的首頁阁最，他的官方文檔非常的多而且詳細(xì)。
Echarts可以繪制的圖有37種骇两，每一種里還有不同的風(fēng)格闽撤，基本上你能想到的數(shù)據(jù)可視化方式都可以通過Echarts實(shí)現(xiàn)。下面給出一些官方的案例：
官方文檔的配置項(xiàng)中把所有的可調(diào)節(jié)參數(shù)都列了出來脯颜，以及這些參數(shù)如何進(jìn)行調(diào)節(jié)都寫得非常清楚，也放了示例代碼贩据。所以這些都沒必要去學(xué)習(xí)并記住栋操。只需要把它當(dāng)成一個(gè)字典，當(dāng)你想要調(diào)節(jié)圖中的什么參數(shù)時(shí)再去其中搜索就行饱亮，非常強(qiáng)大且方便矾芙。
簡單介紹完Echarts接下來我們說說今天的重點(diǎn),怎么能在這個(gè)網(wǎng)頁上實(shí)現(xiàn)在線制圖吶~
第一步當(dāng)然是先思考你想繪制的是哪種類型的圖，在官方實(shí)例中找到相似的例子點(diǎn)進(jìn)去近上，就會(huì)有例子完整代碼剔宪，比如以雷達(dá)圖為例，點(diǎn)進(jìn)去后是這樣的：
完整的代碼都在左側(cè)壹无，并且是可以修改的葱绒，所以我們要做的就是在線修改，首先讀懂它的例子斗锭，在讀懂后基本就可以確定我們要求改的參數(shù)有哪些地淀，將我們的數(shù)據(jù)填進(jìn)去，按我們的需求修改一下就好啦~給大家放個(gè)源代碼和修改后代那的對比岖是，紅色箭頭指的地方是我們需要修改的地方：
一共就7處需要修改帮毁，填上我們的數(shù)據(jù)就可以啦~最后出來的圖是這樣的：
這個(gè)屬于修改比較小的部分，但其實(shí)可以修改調(diào)整的參數(shù)非常多豺撑，給大家放一個(gè)我之前通過這種方式將官網(wǎng)的氣泡圖經(jīng)過非常大的調(diào)整后繪制出的另一種風(fēng)格的氣泡圖烈疚。
官網(wǎng)的案例這這樣的：
我修改后的氣泡圖：
只要善于使用配置項(xiàng)文件，想要修改出什么樣的圖都不成問題~
最后要說的一點(diǎn)是聪轿，畫完圖怎么保存到本地爷肝，就在下圖右下角紅色箭頭指著的地方就有個(gè)Download。到此在線制圖的步驟就徹底結(jié)束了屹电。
最后虎哥想說最重要的一點(diǎn)阶剑！
網(wǎng)頁不保存，記得備份代碼危号，不小心刷新了的話就全都沒有了Ｄ脸睢！外莲！別功虧一簣Ｖ戆搿兔朦！隨時(shí)備份一下代碼！Ｄト贰拆魏！
