12個(gè)最好的 JavaScript 圖形繪制庫

眾多周知躬充,圖形和圖表要比文本更具表現(xiàn)力和說服力。圖表是數(shù)據(jù)圖形化的表示讨便,通過形象的圖表來展示數(shù)據(jù)充甚,比如條形圖,折線圖霸褒,餅圖等等伴找。可視化圖表可以幫助開發(fā)者更容易理解復(fù)雜的數(shù)據(jù)废菱,提高生產(chǎn)的效率和Web應(yīng)用和項(xiàng)目的可靠性技矮。

在這篇文章中,我們收集了12款值得網(wǎng)站開發(fā)者收藏的JavaScript圖形圖表庫殊轴,可以幫助你實(shí)現(xiàn)各種功能的圖表衰倦。


D3.js

D3 是最流行的可視化庫之一,它被很多其他的表格插件所使用旁理。它允許綁定任意數(shù)據(jù)到?DOM樊零,然后將數(shù)據(jù)驅(qū)動(dòng)轉(zhuǎn)換應(yīng)用到文檔中。你可以使用它用一個(gè)數(shù)組創(chuàng)建基本的 HMTL 表格韧拒,或是利用它的流體過度和交互淹接,用相似的數(shù)據(jù)創(chuàng)建驚人的 SVG 條形圖。

ChartJS

Chart.js 是一個(gè)令人印象深刻的JavaScript圖表庫叛溢,建立在HTML5Canvas 基礎(chǔ)上。目前劲适,它支持6種圖表類型(折線圖楷掉,條形圖,雷達(dá)圖,餅圖烹植,柱狀圖和極地區(qū)域區(qū))斑鸦。而且,這是一個(gè)獨(dú)立的包草雕,不依賴第三方 JavaScript 庫巷屿,小于 5KB。

Highcharts JS

Highcharts?JS 是一個(gè)制作圖表的純Javascript類庫墩虹,主要特性如下:兼容性:兼容當(dāng)今所有的瀏覽器嘱巾,包括 iPhone、IE 和火狐等等诫钓;對(duì)個(gè)人用戶完全免 費(fèi)旬昭;純JS,無BS菌湃;支持大部分的圖表類型:直線圖问拘,曲線圖、區(qū)域圖惧所、區(qū)域曲線圖骤坐、柱狀圖、餅裝圖下愈、散布圖纽绍;跨語言:不管是 PHP、Asp.net 還是 Java 都可以使用驰唬。

Fusioncharts

FusionCharts?Suite XT 是個(gè)專業(yè)的JavaScript圖表庫顶岸,能創(chuàng)建任何類型的圖表。它創(chuàng)建的圖表都是可以進(jìn)行完全自定義的叫编,標(biāo)簽辖佣,字體,邊界等等搓逾,都可以進(jìn)行修改卷谈。它有很強(qiáng)的交互功能,有許多信息提示霞篡,可 點(diǎn)擊的 legend 關(guān)鍵字世蔗,還有 dril-down,縮放/滾動(dòng) 和單擊打印圖表功能朗兵。

Flot

Flot?是受?Plotr?和?PlotKit?的 啟發(fā)污淋,Ole Laursen 基于jQuery?開發(fā)了一個(gè)圖表繪制(WEB Chart)插件并命名為 flot。 flot 是個(gè)純 JavaSript 庫余掖,專注于簡(jiǎn)單的使用方式寸爆,迷人的外觀和交互式特性。支持的瀏覽器有: Internet Explorer 6+, Chrome, Firefox 2+, Safari 3+ and Opera 9.5+。

Chartist.js

Chartist.js 提供了優(yōu)美的響應(yīng)圖表赁豆。就像 ChartJS仅醇。它使用 SVG 渲染圖,可以被控制魔种,并通過對(duì)?CSS3?媒體查詢和 SASS 定制析二。另外 Chartist.js 提供很酷的動(dòng)畫。

n3-charts

如果你是一個(gè) AngularJS 開發(fā)者节预,你一定喜歡款有趣的圖表叶摄。它是建立在 D3.js 和?AngularJS?的基礎(chǔ)上,提供了可定制的 AngularJS 指令的形式不同標(biāo)準(zhǔn)的圖表心铃。

Ember Charts

Ember Charts 是一個(gè)基于 Ember.js 和 D3.js 的圖表庫准谚。它包括時(shí)間序列、柱狀圖去扣、餅圖柱衔、點(diǎn)圖,很容易擴(kuò)展和修改愉棱。這些圖表組件代表圖表交互性和演示的最佳實(shí)踐唆铐,是高度可定制和可擴(kuò)展的。

Chartkick

Chartkick 是專為 Ruby 應(yīng)用程序的JavaScript?圖表庫奔滑。它提供了所有主要的圖表類型艾岂,如餅圖,柱形圖朋其,條形圖王浴,面積,地理梅猿,時(shí)間氓辣,以及多個(gè)系列。

MeteorCharts

它有一個(gè)很酷的圖表生成器袱蚓,為您提供選項(xiàng)來選擇圖表钞啸,選擇主題,然后生成一個(gè)圖表喇潘。

amCharts

amCharts 無疑是最漂亮的圖表庫体斩。amCharts 提供了JavaScript/HTML5 Charts、Javascript/HTML5 Stock Chart颖低、JavaScript?Maps 三種圖表組件絮吵。

EJS Chart

EJS圖表聲稱自己是企業(yè)準(zhǔn)備的圖表庫。圖表看起來很干凈忱屑,可讀性比大多數(shù)舊的圖表庫源武。這也是與IE6+等舊瀏覽器兼容扼褪。

uvCharts

uvCharts 是一個(gè)開源的?JavaScript?圖表庫想幻,號(hào)稱有100多個(gè)自定義選項(xiàng)粱栖。它擁有12種不同的標(biāo)準(zhǔn)圖表類型,開箱即用脏毯。

ECharts

基于 Canvas闹究,純?JavaScript?圖表庫,提供直觀食店,生動(dòng)渣淤,可交互,可個(gè)性化定制的數(shù)據(jù)可視化圖表吉嫩。創(chuàng)新的拖拽重計(jì)算价认、數(shù)據(jù)視圖、值域漫游等特性大大增強(qiáng)了用戶體驗(yàn)自娩,賦予了用戶對(duì)數(shù)據(jù)進(jìn)行挖掘用踩、整合的能力。

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

您可能感興趣的相關(guān)文章

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市蓬蝶,隨后出現(xiàn)的幾起案子尘分,更是在濱河造成了極大的恐慌,老刑警劉巖丸氛,帶你破解...
    沈念sama閱讀 219,110評(píng)論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件培愁,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡缓窜,警方通過查閱死者的電腦和手機(jī)定续,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,443評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門谍咆,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人私股,你說我怎么就攤上這事摹察。” “怎么了倡鲸?”我有些...
    開封第一講書人閱讀 165,474評(píng)論 0 356
  • 文/不壞的土叔 我叫張陵供嚎,是天一觀的道長(zhǎng)。 經(jīng)常有香客問我峭状,道長(zhǎng)克滴,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,881評(píng)論 1 295
  • 正文 為了忘掉前任优床,我火速辦了婚禮劝赔,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘胆敞。我一直安慰自己着帽,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,902評(píng)論 6 392
  • 文/花漫 我一把揭開白布竿秆。 她就那樣靜靜地躺著启摄,像睡著了一般。 火紅的嫁衣襯著肌膚如雪幽钢。 梳的紋絲不亂的頭發(fā)上歉备,一...
    開封第一講書人閱讀 51,698評(píng)論 1 305
  • 那天,我揣著相機(jī)與錄音匪燕,去河邊找鬼蕾羊。 笑死,一個(gè)胖子當(dāng)著我的面吹牛帽驯,可吹牛的內(nèi)容都是我干的龟再。 我是一名探鬼主播,決...
    沈念sama閱讀 40,418評(píng)論 3 419
  • 文/蒼蘭香墨 我猛地睜開眼尼变,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼利凑!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起嫌术,我...
    開封第一講書人閱讀 39,332評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤哀澈,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后度气,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體割按,經(jīng)...
    沈念sama閱讀 45,796評(píng)論 1 316
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,968評(píng)論 3 337
  • 正文 我和宋清朗相戀三年磷籍,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了适荣。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片现柠。...
    茶點(diǎn)故事閱讀 40,110評(píng)論 1 351
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖弛矛,靈堂內(nèi)的尸體忽然破棺而出够吩,到底是詐尸還是另有隱情,我是刑警寧澤汪诉,帶...
    沈念sama閱讀 35,792評(píng)論 5 346
  • 正文 年R本政府宣布废恋,位于F島的核電站,受9級(jí)特大地震影響扒寄,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜拟烫,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,455評(píng)論 3 331
  • 文/蒙蒙 一该编、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧硕淑,春花似錦课竣、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,003評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至拇囊,卻和暖如春迂曲,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背寥袭。 一陣腳步聲響...
    開封第一講書人閱讀 33,130評(píng)論 1 272
  • 我被黑心中介騙來泰國(guó)打工路捧, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人传黄。 一個(gè)月前我還...
    沈念sama閱讀 48,348評(píng)論 3 373
  • 正文 我出身青樓杰扫,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親膘掰。 傳聞我的和親對(duì)象是個(gè)殘疾皇子章姓,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,047評(píng)論 2 355

推薦閱讀更多精彩內(nèi)容

  • ATDD中文稱“驗(yàn)證測(cè)試驅(qū)動(dòng)開發(fā)”。 TDD測(cè)試驅(qū)動(dòng)開發(fā)识埋,是敏捷開發(fā)中的一項(xiàng)核心實(shí)踐和技術(shù)凡伊,也是一種設(shè)計(jì)方法論。
    Esauki閱讀 596評(píng)論 0 1
  • 一目標(biāo)二堅(jiān)持三量變到質(zhì)變
    顏雨斜陽閱讀 137評(píng)論 0 0
  • 1.搞兩個(gè)web app惭聂,同樣的url窗声,返回不同的值。 在服務(wù)器搭兩個(gè)tomcat辜纲,一個(gè)端口8080笨觅,一個(gè)端口80...
    小狼在IT閱讀 150評(píng)論 0 1
  • I read the essays wrote before yesterday. because when I ...
    hongwang閱讀 172評(píng)論 0 0