数据可视化的10个优秀JavaScript图表库_类似ploty的js组件

　　现在，网上有许多JavaScript类型的图表库资源。它们功能不同，且各有优、缺点。为了让您能够轻松地进行挑选，我在此准备了十种既可用于创建基本的图表，又能够处置各种特定数据可视化任务的最佳JS库。

　　如今，随着我们身体各类数据的指数级增长，人们需要接受的信息量越来越大，系统必须处理的难度也是越来越高。而这些正是我们需要通过交互式图表和仪表盘，来实现数据可视化的根本原因。在大幅节省用户的时间和精力的同时，此类可视化方式不但需要能够对数据进行分析与解读，而且应当能够基于海量数据做出正确且明智的决策。

　　1.amCharts

　　

　　当您需要一个简单且灵活的数据可视化解决方案时，amCharts便是一种非常实用的JavaScript图表库。

　　主要特点

　　包含地图和甘特图等多种类型的图表。

　　具有友好的交互式选项和深入分析的功能。

　　其文档虽然涵括了所有基本的方法，但是在我看来，它们在使用上并不方便。

　　具有引人入胜的图表动画。

　　可以与React、Angular、Vue和Ember相集成。

　　具有WordPress插件。

　　可导出为图像或PDF文件。

　　提供实时图表，以及完全自定义的、且被W3C认可的辅助功能。

　　为注册用户提供优先且全面的支持。

　　客户群：Microsoft、Amazon、eBay、NASA、Samsung、Yandex、以及AT&T等。

　　定价

　　虽然可以被免费地用于各种用途，但是所有生成的图表都会包含一个小小的品牌链接。若要删除该链接，则需购买付费许可证(180美元起)。同时，您也将为此获得对于该产品的优先支持。

　　更多信息

　　官方网站：amcharts/

　　文档：amcharts/

　　下载链接：

　　amcharts/download

　　2.AnyChart

　　

　　作为一款轻量级的JS图表库，AnyChart不但功能丰富，而且具有SVG/VML(译者注：可缩放矢量图形和矢量可标记语言)呈现功能。实际上，它为Web开发人员提供了创建不同类型图表的绝佳机会。这些图表都有助于数据的分析，以及以数据为驱动所做出的决策。去年，DZone将AnyChart列入了最佳JavaScript数据图表库之一。

　　主要特点

　　提供超过80多种JS图表类型，包括：基本图表、股票图表、地图、甘特图、以及PERT图表等。

　　提供多种设置数据的方法，包括：XML、JSON、CSV、JS API、Google表格和HTML表格。

　　能够深入查看图表中的数据。

　　提供库存技术分析指标，以及开箱即用的绘图工具。

　　提供丰富的文档、API和友好的技术支持。

　　可以与Angular、Qlik、Oracle APEX、React、Elasticsearch、Vue.js、Android、以及iOS等相集成。

　　提供各种样本与仪表盘，以及具有代码自动完成功能的专用playground。

　　支持各种旧的浏览器。

　　能够将图表导出为各种格式，包括：PDF、JPG、PNG、SVG图像、XSLX与CSV文件类型的数据。

　　客户群：Oracle、Microsoft、Citi、Samsung、Nokia、AT&T、Ford、Volkswagen、以及Lockheed Martin等。

　　定价

　　提供免得的带水印版本。如果想去掉logo，或是将AnyChart用作商业目的，则必要购买许可证(49美元起)。

　　更多信息

　　官方网站：anychart/

　　文档：

　　docs.anychart/

　　下载链接：

　　docs.anychart/

　　3.Chart.js

　　

　　Chart.js是一款备受网页设计与开发人员欢迎的，简单且灵活的JavaScript数据图表库。对于那些不需要大量图表与自定义功能，却又希望其图表看起来清晰整洁、且信息量丰富的用户来说，这是一个非常好的基本解决方案。

　　主要特点

　　支持8种图表类型，即：线、面积、条形图、饼图、雷达图、极坐标图、气泡图和散点图。

　　所有的图表类型都可以被自定义、添加动画、并以响应式，被在线使用。

　　可以通过插件来扩展其功能。

　　具有优质的文档。

　　由Stack Overflow(译者注：著名的程序开发技术问答网站)提供支持。

　　支持IE9及以上的浏览器。

　　定价

　　它是一款根据MIT许可证发布的，免费开源的JS图表库。

　　更多信息

　　官方网站：chartjs/

　　文档：

　　chartjs/docs/

　　下载链接：

　　github/chartjs/Chart.js/releases/latest

　　4.Chartist.js

　　

　　Chartist虽然是一款不太引人注目的开源JS库，但是它能够被用来创建漂亮的响应式图表。因此，它对于那些需要极简式图表(如：线条、条形图或饼图)、且对于数据可视化要求不高的用户来说，非常实用。正所谓“一美遮百丑”，凭借着其漂亮的图表显示，它的其他功能倒是被弱化了。

　　主要特点

　　只支持三种图表类型：直线图、条形图和饼图。

　　具有强大的动画效果。

　　其API文档包含了所有必要的信息，但是古董交易平台该文档的可读性不强，需要长时间滚动鼠标中键，才能定位到检索的内容。

　　允许用户通过插件来扩展其功能。

　　将来会兼容、并可使用SVG来绘制图表。

　　支持各种旧的浏览器。

　　定价

　　开源并可免费使用。

　　更多信息

　　官方网站：

　　gionkunz.github/chartist-js/

　　文档：

　　gionkunz.github/chartist-js/getting-started.html

　　下载链接：

　　github/gionkunz/chartist-js/tree/develop/dist

　　5.D3.js

　　

　　D3.js是一款功能强大的，可用于数据可视化任务的JavaScript库。目前，它已在GitHub上被fork(复制)了20,000多次。不过，D3更像是一个框架，而不是图表库。为了让用户方便使用，它提供了许多实用的资源，并能够将各种手稿转化为可视化的图形。

　　主要特点

　　与诸如Voronoi之类的多数JavaScript图表库相比，它能够支持更为广泛的图表类型。

　　它的学习曲线比较陡峭。虽然其文档不及上述提到的商用AnyChart那样清楚易学，但是它带有许多教程和各种不错的API。

　　能够将强大的可视化组件、与数据驱动方法，结合到DOM的操作之中。

　　能够使用浏览器内的元素检查器，以实现轻松的调试。

　　带有数以百个的范例。

　　具有曲线生成函数的功能。

　　支持拖放。

　　定价

　　开源并可免费使用。

　　更多信息

　　官方网站：d3js/

　　文档：

　　github/d3/d3/wiki

　　下载链接：

　　github/d3/d3/releases/latest/

　　6.FusionCharts

　　

　　FusionCharts是一款不错的交互式图表库，它带有数百个开箱即用的图表。这些图表不但接受JSON和XML数据格式，而且能够通过HTML5/SVG或VML予以呈现。

　　主要特点

　　提供数十种2D和3D类型的图表，以及950多种地图。

　　以动画和完全交互的方式，提供图表和地图。

　　提供ASP.NET、PHP和Ruby on Rails类型的服务器端API。

　　兼容jQuery、Angular、PHP、ASP.NET、React Native、Django、React、Ruby on Rails、以及Java等语言工具。

　　具有非常详细的用户指南和API参考文档。

　　提供各种可用于检测的样品和仪表盘。

　　支持各种旧的浏览器。

　　可导出为PNG、JPG或PDF格式。

　　通过知识库和社区论坛提供技术支持。

　　给许可证用户提供不受限的优先支持。

　　客户群：Apple、IBM、Google、Intel、Microsoft、PayPal、Oracle、以及Adobe等。

　　定价

　　可免费用于非商业用途;若用于商业用途，则售价为497美元起。

　　更多信息

　　官方网站：fusionchart/

　　文档：

　　fusioncharts/dev

　　下载链接：

　　fusioncharts/download

　　7.Google Charts

　　

　　对于那些不需要复杂定制、且更注重简约与稳定性的项目来说，Google Charts是一个很好的选择。

　　主要特点

　　提供基于HTML5/SVG和VML的图表。

　　提供各种可用于检测的样品和仪表盘。

　　在所有图表都具有交互性的基础上，部分图表还可被缩放。

　　提供完善的综合性文档。

　　支持各种旧的浏览器。

　　通过FAQ、GitHub和社区论坛提供支持。

　　定价

　　虽然其许可证是免费的，但图表库并不开源。由于不允许在用户服务器上托管Google的各种JS文件，因此不适合那些具有敏感数据的用户。

　　详细信息

　　官方网站：

　　developers.google/chart/

　　文档：

　　developers.google/chart/interactive/docs/

　　下载链接：

　　developers.google/chart/interactive/docs/basic_load_libs

　　8.Highcharts

　　

　　Highcharts是一款全面、且流行的、基于HTML5的JavaScript图表库，它使用SVG/VML来呈现各种类型的图表。由于属于轻量级的图表库，因此它保证了较高的运行性能。

　　主要特点

　　既能够使用纯粹的JavaScript，又可以从外部加载数据。

　　提供强大的文档、API参考和社区作品展示。

　　能够通过交互式选项，让用户深入解读图表中的数据。

　　可以与React、Angular、Meteor、.NET、以及iOS等一起使用。

　　可以导出为PNG、JPG、PDF或SVG格式。

　　能够通过社区论坛和Stack Overflow的方式，对免费版用户提供支持;而对于具有相应许可证的商业用户来说，则能够提供高级的电子邮件与Skype技术支持。

　　客户群：Visa、Yahoo!、Facebook、Twitter、Groupon、Nokia、Ericsson、Mastercard、以及Yandex等。

　　定价

　　供非营利组织免费使用;而对于商业用途，则售价为50美元起。

　　更多信息

　　官方网站：highcharts/

　　文档：

　　highcharts/docs

　　下载链接：

　　highcharts/blog/download

　　9.Plotly.js

　　

　　Plotly.js是一款免费且开源的高端JavaScript软件库。由于是建立在D3.js和WebGL基础之上，因此它可被用于创建包括3D图、和统计图在内的许多不同类型的图表。

　　主要特点

　　可被嵌入网站、或用于创建动态演示文稿，并支持20种图表类型。

　　通过将各种图表抽象为声明性的JSON结构，它可以被Python、R和MATLAB用作基于浏览器的图表库。

　　具有丰富的API文档。

　　具有强大的动画效果。

　　能够使用React。

　　能够将图表导出为PNG和JPG;并在订购之后，提供EPS、SVG和PDF格式。

　　提供各种可用于检测的样品。

　　允许使用Excel电子表格、或直接连接到您的数据库中。

　　具有社区论坛的支持。

　　定价

　　开源并可免费使用。

　　更多信息

　　官方网站：

　　plot.ly/javascript/

　　文档：

　　plot.ly/javascript/

　　下载链接：

　　plot.ly/javascript/getting-started/#download

　　10.ZingChart

　　

　　ZingChart是一款可用于制作交互式与响应式图表的实用工具。它不但灵活高效，而且能够轻松地管理大数据，同时还能生成包含丰富数据内容的图表。

　　主要特点

　　支持30多种图表类型。

　　可完全定制不同的CSS风格版式。

　　兼容jQuery、Angular、Node.js、以及PHP等。

　　提供实时数据，并能快速地呈现任意大小的数据集。

　　可以通过JS对象、JSON、CSV、PHP、AJAX或MySQL来加载数据。

　　提供完整且易读的API。

　　通过ZingChart的帮助中心、Stack Overflow、电子邮件、以及聊天工具，提供免费和高级的技术支持。

　　客户群：Microsoft、Boeing、Adobe、Apple、Cisco、Google、以及Alcatel等。

　　定价

　　只要拥有其品牌许可证，便能免费拥有其图表库的完全访问权限。而对于商业用途，则需购买许可证，售价为199美元起。