用于展现图表的50种JavaScript库
在很多项目中都会有在前端展现数据图表的需求,而在开发过程中,开发者往往会使用一些JavaScript库,从而更有效地达到想要的目标。最近,TechSlide上的一篇文章总结了50种用于展现图表的JavaScript库,并对每种库做了简要的说明。这对于想要选择合适JavaScript库的开发者很有参考意义。
文章作者首推的库是D3,他说到:
它非常让人惊叹,我很喜欢它的简洁性。它的文档非常完备,源代码托管在GitHub上,而且不断会添加新的示例。有一种叫做Tributary的创建D3原型的工具,其中有很多非常棒的示例。这个库非常好,以至于xcharts、nvd3、Rickshaw、Cubism.js、dc.js、xkcd都是基于它构建的。如果你想要做出优秀的自定义数据可视化效果,那么D3可能是你最佳选择,或者对于更简单的图,你可以选择上面所提到的基于D3的库。最后,我强烈推荐阅读Scott Murray关于D3的免费书《Interactive Data Visualization for the Web》和《Dashing D3 tutorials》。
接下来,他列举并简要说明了其它用于展现数据、制作表格和图表的JavaScript库,列在前20位的如下:
- HighCharts——它非常强大,你可以在JSFiddle中查看和编辑大量示例。它不免费,但拥有很多客户(IBM、NASA、MasterCard等)。它还向下兼容IE 8。
- jqPlot——如果你已经在使用jQuery,不想为HighCharts付费,而且情况很简单,不需要D3那样复杂的库,那么jqPlot是很好的选择。
- dygraphs——一种开源的JavaScript库,可以做出可交互、可缩放的时间线图表。对于大数据集合非常适用。
- Protovis——和D3出自同一支团队之手,是一种免费的开源库。你可以查看这个stackoveflow 页面来了解D3与其的区别。
- Flot Charts——与jqPlot一样,Flot是一种针对jQuery的纯JavaScript库,专注于简单的用法、引人注目的外观和交互特性。
- Google Chart Tools——强大、免费、易于使用。内容丰富,从最简单的线状图到负责的层级树状图都有,在展示页面中提供了大量设计良好的图表类型。
- dc.js——基于D3的JavaScript图表库,拥有本地跨过滤器(crossfilter)的支持,并让你可以高效率地浏览大型多维数据集。
- xcharts——基于D3用于构建自定义图表的库。
- nvd3——让你可以构建可重用的图表和图表组件,同时具有d3.js的强大功能。
- rickshaw——用于创建可交互时间线图表的JavaScript工具。
- Cubism.js——用于可视化时间线的D3插件。使用了Cubism构建更好的实时仪表盘,可以从Graphite、Cube和其他源拉取数据。
- xkcd——让你可以使用D3在JavaScript中做出XKCD样式的图表。
- jQuery Sparklines——一种jQuery插件,可以直接在浏览器中创建小型的内嵌图表。
- peity——一种简单的jQuery插件,可以把元素的内容转换成简单的饼图、线图和柱状图。
- BonsaiJS——一种轻量级的图形库,拥有直观的图形API和SVG渲染器。
- Flotr——为Prototype.js所用的JavaScript图表库。它拥有很多特性,像对负数值的支持、鼠标跟踪、选定支持、缩放支持、事件挂钩、CSS样式支持、在画布(canvas)中包含文字、旋转的标签、渐变颜色、图形标题和子标题、电子表格、CSV数据下载等等。
- ProtoChart——物如其名,ProtoChart让你可以使用JavaScript和Prototype创建很漂亮的图表。它是一种开源库。
- Flotr2——HumbleSoftware当前正在做的项目,让你可以使用Canvas和JavaScript创建图表。
- jQuery-Visualize——HTML的table元素驱动的HTML5 canvas图表。也是针对jQuery的图表插件。
- JS Charts——基于JavaScript的图表生成器,只需要很少甚至不需要编码。免费版会有水印,可以通过付费去掉。
- ……
文章中还列举的JavaScript库有:PlotKit、MilkChart、moochart、moowheel、table2chart、Canvas 3D Graph、TufteGraph、ArborJS、TimePlot、gRaphael、ICO、Elycharts、ZingChart、RGraph、Dojo Charting、Bluff、canvasXpress、ccchart、JIT、JSXGraph、Smoothie Charts、YUI Charts、amcharts、Emprise JavaScript Charts、FusionCharts、JavaScript Diagram Builder、jGraph、Sencha Touch Charts、Style Chart、AwesomeChartJS等,都各有千秋,如果你对这些库感兴趣的话,可以访问相应的链接或者阅读原文。
这个列表对于想要利用JavaScript技术创建图表展现数据的开发者来说,非常具有参考意义,你可以从中选择最适合的库,从而高效、高质量地完成任务。
来源:InfoQ投稿,原文链接。
http://www.williamlong.info/archives/3372.html
用于展现图表的50种JavaScript库的更多相关文章
- 4 个用于执行高级数学计算的 JavaScript 库
在使用JavaScript执行数学方面的任务时,往往要用到浮点运算,且需要精确到某位小数,这就容易造成错误,而且会相当费时.因此,如果你需要做一些高精度的数学计算的编程工作,比如财务或科学计算,那么你 ...
- 一个用于格式化和处理数字的javascript库----Numeral.js
npm地址:https://www.npmjs.com/package/numeral 1.转化成百分比: numeral(num).format('0.00%')
- 34 个今年11月最受欢迎的 JavaScript 库
作者:Iren Korkishko 译者:前端小智 来源:dev 点赞再看,养成习惯 本文 GitHub:github.com/qq449245884… 上已经收录,更多往期高赞文章的分类,也整理了很 ...
- Numeral.js – 格式化和操作数字的 JavaScript 库
Numeral.js 是一个用于格式化和操作数字的 JavaScript 库.数字可以格式化为货币,百分比,时间,甚至是小数,千位,和缩写格式,功能十分强大.支持包括中文在内的17种语言. 您可能感兴 ...
- QRCode.js一个生成二维码的javascript库
前言 最近在开发中遇到一个需求:将后端返回的链接转换成二维码,那么如何来实现呢?我们可以使用QRCode.js来解决这一问题 什么是 QRCode.js? QRCode.js 是一个用于生成二维码的 ...
- Boba.js – 用于 Google 统计分析 JavaScript 库
Boba.js 是一个小的,易于扩展的 JavaScript 库,让谷歌分析(Google Analytics)的更灵活,更容易.它同时支持旧的 ga.js 库以及新的 analytics.js 库. ...
- Baffle.js – 用于实现文本模糊效果的 JavaScript 库
Baffle.js 是一个 JavaScript 库,设计用来模糊和揭开DOM元素的文本. 这些元素可以是一个 CSS 选择器的形式.一个节点列表或者一个单节点. 你也可以传递一个选择对象给插件. 在 ...
- 最新的jQuery插件和JavaScript库
每一个前端开发人员很清楚的重要性和功能的JavaScript库提供.它提供了一个简单的接口,用于构建快速动态的接口,而无需大量的代码. 谢谢你的超级从事jQuery开发者社区,人始终是创造新的和令人惊 ...
- 20个简化开发任务的 JavaScript库
所谓JavaScript库就是预先写好的可以简化基于JavaScript的应用程序开发的,尤其是Ajax和其它以web为中心的技术的 JavaScript代码集.JavaScript主要用于写内嵌于H ...
随机推荐
- spring mvc 返回json数据的四种方式
一.返回ModelAndView,其中包含map集 /* * 返回ModelAndView类型的结果 * 检查用户名的合法性,如果用户已经存在,返回false,否则返回true(返回json数据,格式 ...
- 关于Scrapy框架的安装
Scrapy介绍与环境安装 Scrapy介绍与环境安装 What is scrapy? An open source and collaborative framework for extractin ...
- The following classes could not be found: - android.support.v7.internal.widget.ActionBarOverlayLayou解决方案
如图出现如下的错误的时候,一般都是升级Androdi Studio 后导致的,引入库不全,或者其他 东西缺少,可以如下解决方案: 或者如下的解决方案: 在布局文件的Design界面中,修改原来的App ...
- 在ProgressBar上加文字----显示百分比的进度条
http://www.cnblogs.com/3dant/archive/2011/04/25/2026776.html
- SQL Server 内存不足引起的并发症
第一:cpu 1.内存不足就会有频繁的页面调入调出.这个过程是要有cpu的参与的.所以这个要影响cpu! 2.内存不足可能会引有用起执行计划被清除.当起次要执行时.这个就要重编译一次!
- qt5集成libcurl实现tftp和ftp的方法一:搭建环境(五篇文章)
最近使用QT5做一个软件,要求实现tftp和ftp文件传输,使用QT5开发好UI界面等功能,突然发现QT5不直接提供tftp和ftp支持,无奈之下只好找第三方库来间接实现,根据网友的介绍,libcur ...
- HDU 5768 Lucky7(CRT+容斥原理)
[题目链接] http://acm.hdu.edu.cn/showproblem.php?pid=5768 [题目大意] 求出一个区间内7的倍数中,对于每个ai取模不等于bi的数的个数. [题解] 首 ...
- 重拾CSS基础—开篇
由来 从事软件行业一晃也5年有余,之间参与过若干个基于web的项目,所以javascript和Html基本已经相当熟悉,最近对于web前端开发比较关注,分析后发现CSS的确是自己的弱项,于是决定再加强 ...
- (Android) ContentProvider 实例
ContentProvider 用于应用程序(Android Application)之间传递数据,包括Insert, update, delete, query. 下面的例子是在两个应用之间传递数据 ...
- 【D3.V3.js系列教程】--(十二)坐标尺度
[D3.V3.js系列教程]--(十二)坐标尺度 1.多种类型的缩放尺度 Quantitative Scales Linear Scales Identity Scales Power Scales ...