HTML & CSS ? 21個(gè)實(shí)用的Javascript數據圖表插件

21個(gè)實(shí)用的Javascript數據圖表插件

發(fā)表于: HTML & CSS. 評論 (2)
Sponsor

今天主要和大家分享一些統計圖表相關(guān)的JS插件,圖表通常用在網(wǎng)站后臺界面,作為一種可視化數據形式展示,能讓用戶(hù)直觀(guān)的查看統計信息,然而圖表在WEB上實(shí)現是比較復雜的,特別有些要實(shí)現移動(dòng)端顯示,這樣的前端代碼編寫(xiě)難度較高,所以如果能使用一些圖表庫就方便多了。

在本文我們精選了21個(gè)優(yōu)秀的Javascript數據圖表插件,支持很多不同類(lèi)型的圖表庫,而且多數是開(kāi)源代碼,可以免費使用,值得前端人員收藏。

Chartist.js

JS圖表庫

Chartist 是一個(gè)響應式圖表庫,支持桌面和移動(dòng)平臺使用,支持CSS動(dòng)畫(huà),但兼容性需要在IE9以上,其它流行的瀏覽器一般都兼容了。 版權:?免費使用

在線(xiàn)演示&下載

ECharts

JS圖表庫

ECharts,縮寫(xiě)來(lái)自Enterprise Charts,商業(yè)級數據圖表,一個(gè)純Javascript的圖表庫,可以流暢的運行在PC和移動(dòng)設備上,兼容當前絕大部分瀏覽器(IE6/7/8/9/10/11,chrome,firefox,Safari等),底層依賴(lài)輕量級的Canvas類(lèi)庫ZRender,提供直觀(guān),生動(dòng),可交互,可高度個(gè)性化定制的數據可視化圖表。創(chuàng )新的拖拽重計算、數據視圖、值域漫游等特性大大增強了用戶(hù)體驗,賦予了用戶(hù)對數據進(jìn)行挖掘、整合的能力。

支持折線(xiàn)圖(區域圖)、柱狀圖(條狀圖)、散點(diǎn)圖(氣泡圖)、K線(xiàn)圖、餅圖(環(huán)形圖)、雷達圖(填充雷達圖)、和弦圖、力導向布局圖、地圖、儀表盤(pán)、漏斗圖、事件河流圖等12類(lèi)圖表,同時(shí)提供標題,詳情氣泡、圖例、值域、數據區域、時(shí)間軸、工具箱等7個(gè)可交互組件,支持多圖表、組件的聯(lián)動(dòng)和混搭展現。

在線(xiàn)演示&下載

FusionCharts

JS圖表庫

版權: 免費個(gè)人使用,商業(yè)用途需付費

在線(xiàn)演示&下載

Dygraphs

JS圖表庫

要在IE8以上才能正常瀏覽 版權:免費使用

在線(xiàn)演示&下載

Chart.js

JS圖表庫

Chart.js 是一個(gè)輕量的圖表庫,大小只有11KB,圖表設計簡(jiǎn)約,速度快,如果用于一些小型數據展示,我想這個(gè)很適合。 版權:?免費使用

在線(xiàn)演示&下載

Google Charts

JS圖表庫

在線(xiàn)演示&下載

Highcharts

JS圖表庫

? 版本:個(gè)人免費使用,商業(yè)用途需付費 ?

在線(xiàn)演示&下載

Flot

JS圖表庫

版權:免費使用

在線(xiàn)演示&下載

D3.js

JS圖表庫

版權:免費使用

在線(xiàn)演示&下載

n3-charts

JS圖表庫

版權:免費使用

在線(xiàn)演示&下載

NVD3

JS圖表庫

版權:免費使用

在線(xiàn)演示&下載

Ember Charts

JS圖表庫

版權:免費使用

在線(xiàn)演示&下載

jQuery Sparklines

JS圖表庫

版權:免費使用

在線(xiàn)演示&下載

Sigma.js

JS圖表庫

版權:免費使用

在線(xiàn)演示&下載

Morris.js

JS圖表庫

版權:免費使用

在線(xiàn)演示&下載

Cytoscape.js

JS圖表庫

版權:免費使用

在線(xiàn)演示&下載

C3.js

JS圖表庫

版權:免費使用

在線(xiàn)演示&下載

Rickshaw

JS圖表庫

版權:免費使用

在線(xiàn)演示&下載

Cubism.js

JS圖表庫

版權:免費使用

在線(xiàn)演示&下載

Plottable.js

JS圖表庫

版權:免費使用

在線(xiàn)演示&下載

Canvas.js

JS圖表庫

版權:免費個(gè)人使用,商業(yè)需付費

在線(xiàn)演示&下載

如果有更好的Javascript圖表插件,歡迎在下方留言處分享給大家:)

推薦:查看最受歡迎的 301 個(gè)設計網(wǎng)站 → http://hao.shejidaren.com
交流:為設計新人提供的設計交流群,請加入UI設計交流群,分享經(jīng)驗、接單、求職、聊設計。
贊助商鏈接
贊助商鏈接
設計達人微信交流社區:shejidaren888
喜歡這篇文章嗎?歡迎分享到你的微博、QQ群,并關(guān)注我們的微博,謝謝支持。
版權:除非注明,本站文章均為原創(chuàng )文章,轉載請聯(lián)系我們授權,否則禁止轉載。

+ 添加評論2 Responses to “21個(gè)實(shí)用的Javascript數據圖表插件”

  1. 斷天涯大蝦 - 回復

    不錯不錯,如果也包含了FlexChart圖表控件的介紹,就更好了

  2. Win7en樂(lè )園 - 回復

    學(xué)習了哈!


{ 發(fā)表評論 }