前端数据可视化插件大盘点 图表/图谱/地图/关系图全有

在大数据时代，很多时候我们需要在网页中显示数据统计报表，从而能很直观地了解数据的走向，开发人员很多时候需要使用图表来表现一些数据。随着Web技术的发展，从传统只能依靠于flash、IE的vml，各个浏览器尚不统一的svg，到如今规范统一的canvas、svg为代表的html5技术，表现点、线、面要素的技术已经越来越规范成熟。我把前端数据可视化分为了五种：

1.图表

2.图谱

3.地图

4.关系图

5.立体图

我将按照顺序介绍62款前端可视化插件，下面就分享下34款图表插件：

1.amcharts

url： http://www.amcharts.com/

browser：IE6+、chrome、safari、firefox、opear

resume：amCharts是一种先进的图表库,将适合任何数据可视化的需要。图表解决方案包括柱、栏、线、区域,一步,一步没有冒口,平滑线,烛台,OHLC,馅饼/甜甜圈,雷达/极地,XY /分散/泡沫,子弹,漏斗/金字塔图以及指标。

2.awesomechartjs

url：http://cyberpython.github.io/AwesomeChartJS/

github：https://github.com/cyberpython/AwesomeChartJS

browser：现代浏览器

resume：AwesomeChartJS是一个简单的Javascript库,可用于创建图表基于HTML 5画布元素。

3.axiis

url：http://www.axiis.org/

browser：官方未说明

resume：Axiis框架是一个开源的数据可视化为初学者和专家开发人员设计的。

4.bonsaijs

url：http://bonsaijs.org/

github：https://github.com/uxebu/bonsai

browser：IE9+、chrome20+、safari5+、firefox18+、opear12+

resume：用于创建图形和动画的js库

5.canvasjs

url：http://canvasjs.com

browser：官方未说明

resume：一个使用HTML5、JavaScript创建图表在画布上，图表包括几个好看的主题和10倍的速度比传统的基于Flash / SVG库——导致轻量级的,美丽的和响应指示板。收费

6.canvasxpress

url：http://canvasxpress.org/

browser：Firefox 1.5+, Opera 9+, Safari 3.x+, Chrome 1.0+, IE 6+

resume：CanvasXpress是一个独立的Javascript编写的图形库，支持所有主流浏览器中计算机和移动设备。

7.chartist

url：http://gionkunz.github.io/chartist-js/

github：https://github.com/gionkunz/chartist-js

browser：Firefox, Chrome, Safari, Opera, IE9+

resume：绘制多种图形的库

8.chartjs

url：http://www.chartjs.org/

github：https://github.com/nnnick/Chart.js

browser：IE9+、chrome、safari、firefox、opear、部分支持IE7/8

resume：chartjs是一个可以绘制多种图表的库，使用了html5的canvas技术

9.chartkick

url：http://ankane.github.io/chartkick/

github：https://github.com/ankane/chartkick

browser：IE6+、chrome、safari、firefox、opear

resume：chartkick是一个依赖于ruby的绘制图表的js库，在Python中也可以使用

10.DataWrapper

url：https://datawrapper.de/

github：https://github.com/datawrapper/datawrapper

browser：支持大部分浏览器

resume：Datawrapper完全免费，开源。您可以使用他们的免费主机服务，或者安装在您自己的服务器上。Datawrapper用PHP编写，非常易于安装、修改和拓展。可以绘制。但是DataWrapper是生成图表后嵌入到站点的。

11.dataset

url：http://misoproject.com/dataset/

github：https://github.com/misoproject/dataset

browser：官方未说明

resume：dataset是一个JavaScript客户端数据转换和管理库。数据集管理客户端数据简单处理加载、解析、排序、查询和操纵来自各种数据源的数据。

12.dc