本篇文章為大家展示了基于html5 Canvas圖表庫(kù)的ECharts怎么用，內(nèi)容簡(jiǎn)明扼要并且容易理解，絕對(duì)能使你眼前一亮，通過(guò)這篇文章的詳細(xì)介紹希望你能有所收獲。

目前創(chuàng)新互聯(lián)公司已為成百上千的企業(yè)提供了網(wǎng)站建設(shè)、域名、網(wǎng)頁(yè)空間、成都網(wǎng)站托管、企業(yè)網(wǎng)站設(shè)計(jì)、高臺(tái)網(wǎng)站維護(hù)等服務(wù)，公司將堅(jiān)持客戶導(dǎo)向、應(yīng)用為本的策略，正道將秉承"和諧、參與、激情"的文化，與客戶和合作伙伴齊心協(xié)力一起成長(zhǎng)，共同發(fā)展。

ECharts開(kāi)源來(lái)自百度商業(yè)前端數(shù)據(jù)可視化團(tuán)隊(duì)，基于html5Canvas，是一個(gè)純Javascript圖表庫(kù)，提供直觀，生動(dòng)，可交互，可個(gè)性化定制的數(shù)據(jù)可視化圖表。創(chuàng)新的拖拽重計(jì)算、數(shù)據(jù)視圖、值域漫游等特性大大增強(qiáng)了用戶體驗(yàn)，賦予了用戶對(duì)數(shù)據(jù)進(jìn)行挖掘、整合的能力。——大數(shù)據(jù)時(shí)代，重新定義數(shù)據(jù)圖表的時(shí)候到了

Architecture

ECharts(EnterpriseCharts商業(yè)產(chǎn)品圖表庫(kù))

提供商業(yè)產(chǎn)品常用圖表庫(kù)，底層基于ZRender，創(chuàng)建了坐標(biāo)系，圖例，提示，工具箱等基礎(chǔ)組件，并在此上構(gòu)建出折線圖（區(qū)域圖）、柱狀圖（條狀圖）、散點(diǎn)圖（氣泡圖）、餅圖（環(huán)形圖）、K線圖、地圖、和弦圖以及力導(dǎo)向布局圖，同時(shí)支持任意維度的堆積和多圖表混合展現(xiàn)。

混搭的圖表會(huì)更具表現(xiàn)力也更有趣味，ECharts提供的圖表（共9類(lèi)14種）支持任意混搭：

折線圖（區(qū)域圖）、柱狀圖（條狀圖）、散點(diǎn)圖（氣泡圖）、K線圖、餅圖（環(huán)形圖）、雷達(dá)圖、地圖、和弦圖、力導(dǎo)布局圖。

包含圖例、工具箱、數(shù)據(jù)區(qū)域縮放、值域漫游模塊，一個(gè)直角坐標(biāo)系（可包含一條或多條類(lèi)目軸線，一條或多條值軸線，最多上下左右四條）

拖拽重計(jì)算

拖拽重計(jì)算特性（專(zhuān)利）帶來(lái)了數(shù)據(jù)統(tǒng)計(jì)圖表從未有過(guò)的用戶體驗(yàn)，允許用戶對(duì)統(tǒng)計(jì)數(shù)據(jù)進(jìn)行有效的提取、整合，甚至在多個(gè)圖表間交換數(shù)據(jù)，賦予了用戶對(duì)數(shù)據(jù)進(jìn)行挖掘、整合的能力。

數(shù)據(jù)視圖

如果你所呈現(xiàn)的數(shù)據(jù)足夠讓用戶所關(guān)心，那么他們將不滿足于查看可視化的圖表，要去逐一迎合他們下載保存，數(shù)據(jù)分享，加工整合已有數(shù)據(jù)等等需求？

或許你只要給予一個(gè)","分隔的數(shù)據(jù)文本他們就懂了，這就是ECharts的數(shù)據(jù)視圖！當(dāng)然，你可以重載數(shù)據(jù)視圖的輸出方法，用你獨(dú)特的方式去呈現(xiàn)數(shù)據(jù)。

如果你的用戶足夠的高端，你甚至可以打開(kāi)數(shù)據(jù)視圖的編輯功能，跟拖拽重計(jì)算相比，這可是批量的數(shù)據(jù)修改！

動(dòng)態(tài)類(lèi)型切換

很多圖表類(lèi)型本身所表現(xiàn)的能力是相似的，但由于數(shù)據(jù)差異、表現(xiàn)需求和個(gè)人喜好的不同導(dǎo)致最終圖表所呈現(xiàn)的張力又大不一樣，比如折線圖和柱狀圖的選擇,系列數(shù)據(jù)是堆疊還是平鋪總是讓人頭疼。

ECharts提供了動(dòng)態(tài)類(lèi)型切換，讓用戶隨心所欲的切換到他所需要的圖表類(lèi)型和堆疊狀態(tài)。

多系列數(shù)據(jù)的同時(shí)展現(xiàn)呈現(xiàn)出豐富內(nèi)容，但如何讓用戶切換到他所關(guān)心的個(gè)別系列上？

ECharts提供了方便快捷的多維度圖例開(kāi)關(guān)，可以隨時(shí)切換到你所關(guān)心的數(shù)據(jù)系列。

數(shù)據(jù)區(qū)域選擇

數(shù)據(jù)可以是無(wú)限的，但顯示空間總是有限的，數(shù)據(jù)區(qū)域選擇組件提供了大數(shù)據(jù)量中漫游的能力，讓用戶選擇并呈現(xiàn)他所關(guān)心的數(shù)據(jù)區(qū)域。

配合隨動(dòng)的均值（極值）標(biāo)線，標(biāo)注展現(xiàn)強(qiáng)大的數(shù)據(jù)剖析能力。

多圖聯(lián)動(dòng)

多系列數(shù)據(jù)在同一個(gè)直角系內(nèi)同時(shí)展現(xiàn)有時(shí)候會(huì)產(chǎn)生混亂，但他們又存在極強(qiáng)的關(guān)聯(lián)意義不可分離？

ECharts提供了多圖聯(lián)動(dòng)的能力（connect），能做的可不僅僅是鼠標(biāo)劃過(guò)的詳情顯示，連接的多個(gè)圖表會(huì)共享組件事件并且實(shí)現(xiàn)了保存圖片時(shí)的自動(dòng)拼接。

值域漫游

基于坐標(biāo)的圖表（如地圖、散點(diǎn)圖）通過(guò)色彩變化表現(xiàn)數(shù)值的大小能直觀形象的展示數(shù)據(jù)分布。

但如何聚焦到我所關(guān)心的數(shù)值上？我們創(chuàng)造了稱為值域漫游的功能，讓你可以輕松進(jìn)行數(shù)值篩選。

上述內(nèi)容就是基于html5 Canvas圖表庫(kù)的ECharts怎么用，你們學(xué)到知識(shí)或技能了嗎？如果還想學(xué)到更多技能或者豐富自己的知識(shí)儲(chǔ)備，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

網(wǎng)頁(yè)名稱：基于html5Canvas圖表庫(kù)的ECharts怎么用-創(chuàng)新互聯(lián)
當(dāng)前URL：http://www.aaarwkj.com/article30/csojpo.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供云服務(wù)器、搜索引擎優(yōu)化、響應(yīng)式網(wǎng)站、微信公眾號(hào)、定制開(kāi)發(fā)、全網(wǎng)營(yíng)銷(xiāo)推廣

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)