開發(fā)人員很多時(shí)候需要使用圖表來表現(xiàn)一些數(shù)據(jù)，而一張圖表往往能夠比幾行密密麻麻的數(shù)字表格更能直觀地展示數(shù)據(jù)內(nèi)容。隨著Web技術(shù)的發(fā)展，從傳統(tǒng)只能依 靠于flash、IE的vml，各個瀏覽器尚不統(tǒng)一的svg，到如今規(guī)范統(tǒng)一的canvas、svg為代表的html5技術(shù)，表現(xiàn)點(diǎn)、線、面要素的技術(shù)已 經(jīng)越來越規(guī)范成熟。我在本篇文章中收集了10款免費(fèi)開源且比較優(yōu)秀的圖表制作插件，以供各位參考。

　　1，ichartjs(國產(chǎn))

    ichartjs是一款優(yōu)秀的國產(chǎn)開源插件，作者是王鶴，英文名taylor，畢業(yè)于南昌大學(xué)軟件工程專業(yè)。

    ichartjs 是一款基于HTML5的圖形庫。使用純javascript語言, 利用HTML5的canvas標(biāo)簽繪制各式圖形。 ichartjs致力于為您的應(yīng)用提供簡單、直觀、可交互的體驗(yàn)級圖表組件。是WEB/APP圖表展示方面的解決方案 。如果你正在開發(fā)HTML5的應(yīng)用，ichartjs正好適合您。 ichartjs目前支持餅圖、環(huán)形圖、折線圖、面積圖、柱形圖、條形圖。ichartjs是基于Apache License 2.0協(xié)議的開源項(xiàng)目。

　　2，echarts(國產(chǎn))

    Echarts是百度前端團(tuán)隊(duì)做的基于html5-canvas的開源圖表繪制組件。

    幾個特性如下：

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

    大規(guī)模數(shù)據(jù)模式：如何展現(xiàn)成千上百萬的數(shù)據(jù)？貌似除了用專業(yè)的統(tǒng)計(jì)工具（如MATLAB）外別無選擇？不，在擁有眾多交互特性下ECharts依然可以做到直角系圖表（折、柱、散點(diǎn)、K線）20萬數(shù)據(jù)秒級出圖。

    值域漫游：基于坐標(biāo)的圖表（如地圖、散點(diǎn)圖）通過色彩變化表現(xiàn)數(shù)值的大小能直觀形象的展示數(shù)據(jù)分布。但如何聚焦到我所關(guān)心的數(shù)值上？ECharts擁有值域漫游的功能，讓你可以輕松進(jìn)行數(shù)值篩選。

　　3，Loongchart(國產(chǎn))

    LoongChart是一款基于HTML5-Canvas的開源信息圖表繪制組件，難能可貴的是該插件能夠兼容IE7、IE8，但動畫效果較差，靜態(tài)顯示效果基本滿足要求。

    有以下特點(diǎn)：
    純html5及Javascript，跨平臺，原生支持現(xiàn)代瀏覽器，兼容IE7、IE8，不依賴任何框架；
    支持多種常用繪圖類型；
    支持組合圖；
    支持核心代碼內(nèi)的語言設(shè)定(用于錯誤提示)；
    支持動畫(可關(guān)閉)；
    支持皮膚設(shè)定以及自定義定制皮膚功能；
    部分圖形支持3D圖
    支持自定義繪圖；
    記錄最終繪制的圖形中的各元素位置、大小等信息，以供查詢；
    支持直接導(dǎo)出圖片(非全部均瀏覽器支持)；

     LoongChart官網(wǎng)有一個比較貼心的功能，它支持在線修改選項(xiàng)和查看選項(xiàng)，并可以實(shí)時(shí)顯示修改選項(xiàng)后的效果。如果用戶找到合適的選項(xiàng)，就可以直接查看實(shí)時(shí)選項(xiàng)并復(fù)制到自己的項(xiàng)目中，非常方便。

　　4，Chart.js

    小巧而輕便的的圖表插件，缺點(diǎn)是支持的圖形類型較少，數(shù)據(jù)交互功能也非常有限，但作者以后可能會逐漸完善。

　　5，Jqplot

    一個相當(dāng)古老而“堅(jiān)挺”的圖表插件，支持現(xiàn)代瀏覽器和IE7，IE8（和LoongChart一樣，拋棄IE6了）。

　　6，gRapha?l

     支持現(xiàn)代瀏覽器，以及IE6.0+，兼容性相當(dāng)不錯。

　　7，RGraph

     支持現(xiàn)代瀏覽器， 兼容IE7、IE8。

　　8，CanvasXpress

    支持相當(dāng)多類型的圖表，API也相當(dāng)齊全。

　　9，AwesomeChartJS

     支持的圖形類型相對來說不是很多。

　　10，Dygraphs

    dygraphs is a fast, flexible open source JavaScript charting library.

    Features：
    Handles huge data sets: dygraphs plots millions of points without getting bogged down.
    Interactive out of the box: zoom, pan and mouseover are on by default.
    Strong support for error bars / confidence intervals.
    Highly customizable: using options and custom callbacks, you can make dygraphs do almost anything.
    dygraphs is highly compatible: it works in all major browsers (including IE8). You can even pinch to zoom on mobile/tablet devices!
    There's an active community developing and supporting dygraphs.