开源中国

我们不支持 IE 10 及以下版本浏览器

It appears you’re using an unsupported browser

为了获得更好的浏览体验,我们强烈建议您使用较新版本的 Chrome、 Firefox、 Safari 等,或者升级到最新版本的IE浏览器。 如果您使用的是 IE 11 或以上版本,请关闭“兼容性视图”。
20 个最棒的 JavaScript 图表库 - 技术翻译 - 开源中国社区

20 个最棒的 JavaScript 图表库 【已翻译100%】

oschina 推荐于 3年前 (共 19 段, 翻译完成于 06-17) 评论 34
收藏  
430
推荐标签: JavaScript 待读

每个企业在做重要决定时都倾向于做数据分析。实际上他们很多时候都是沉沦在数据里头,不知道如何跳出其中。随着大数据的到来,曾经好用的表格和图表只是不再削减它了。

企业一直寻求更好的方式来可视化数据,更好的互动和使图表多角度。毕竟,只有从数据中抽出的见解才是有用的。

JavaScript 图表库出现了,作为漂亮的,容易理解的,交互式的可视化图表最有力的工具。它能更容易提取和传达关键的模式和见解,而静态图表往往不明显。

为了使事情更加简单,我努力挖掘了很多选项,找到了你需要的最好的 JavaScript 图表库。所以,让我们开始吧。

西南茂
 翻译得不错哦!

1. Chartist.js

1. chartist

Chartist 的高效和人性化设计甚至吸引了离开 Excel 就会感觉不舒服的人。可响应(使用媒体查询)和独立 DPI 意味着这些图表可以为你提供一个良好的解决方案,如果你在考虑将你的图表应用于包括手机,平板和桌面电脑的多终端设备。基于 SVG 的设计让它在未来更具兼容性。

Chartist 的于从不同在于它是社区的成果,这使得它没有其他图表库的局限性。由于过于关注琐碎的变动和功能完整,导致你在使用其他类库时很焦心。

协议: 开源,所有用户皆可免费使用。

wancheng
 翻译得不错哦!

2. FusionCharts

2. FusionCharts

FusionCharts 带来了一个最全面的库,超过 90 中图表和 900 种图——所有均就绪备用。它们自诩为行业内最好看图表,它提供了一个功能强大的体验仪表板,通过它可以鸟瞰其整个业务功能。

FusionCharts 兼容从 PC 和 Mac 电脑,iPhone 和 Android 平板电脑等多种设备;他们做了许多额外的努力来确保跨浏览器的兼容性,甚至包括 IE6!

他们还涵盖了所有基础格式 —— JSON 和 XML 数据格式都能够接受;绘制可以通过 HTML5、SVG 和 VML,图表可以导出为 PNG,JPG 或 PDF 格式。FusionCharts 的扩展可以很容易地与你所选择的任何技术集成,包括 jQuery,AngularJS,PHP 和 Rails。

总的来说,FusionCharts 拥有你创建漂亮图表和做严格业务分析所需的任何特征和格式。而且最好的部分是非商业用途时你可以免费下载并使用,没有任何限制。

源码许可证:非商业免费,商业用途收费。

Garfielt
 翻译得不错哦!

3. Dygraphs

3. DyGraphs

Dygraphs 是一个开源的 JavaScript 图表库,最适用于极端大数据集。它是开箱式互动,通过缩放甚至可以支持手机。

它既兼容主流浏览器,也向后兼容 IE8。选项和自定义回调功能使它具有极高的可配置性。

协议: 开源,面向所有用户免费。

wancheng
 翻译得不错哦!

4. Chart.js

4. Chartjs

Chart.js适用于小项目,如果你需要扁平化,干净,优雅,快速。它是一个微型的开源库,最小化压缩后只有11kb大小。包括六个核心图表类型(线图,柱图,雷达图,极地图,饼图和环形图)每个都是独立的模块,所以你甚至可以只加载项目需要的模块以最大化缩小代码占用空间。

它使用HTML5 canvas元素渲染图表,并且使用polyfills方式兼容在IE7/8上运行。所有图表都是可响应的。 

协议: 开源,面向所有用户免费。

wancheng
 翻译得不错哦!

5. Google Charts

5. GoogleCharts

Google Charts 提供大量不同种类的图表,它最大程度上满足了数据可视化的需要。图表基于 HTML5/SVG,为了兼容老版本的 IE 还支持 VML。所有的图表都是可交互,可缩放的。你可以去看看他们的图表库。并且最棒的部分是他们的图表绝对免费。

协议:免费,但是不开源,在你的服务器上使用他们的 JS 文件是 Google’s协议不允许 的。因此如果你是一家企业并且有很多敏感数据,Google Charts 可能不是一个最佳的选项。

无若
 翻译得不错哦!

6. Highcharts

6. HighCharts

Highcharts 是又一个流行的交互图表库,与其他库一样,它是基于 HTML5/SVG/VML,所以不需要扩展插件。提供的图表类型很广泛,像曲线图,柱状图,条形图,地图,仪表盘等。

它还提供个人用户免费,可在线生成交互式图表的接口 Highcharts cloud,商业使用需要购买授权。

协议: 非商业使用免费,商业使用付费。

wancheng
 翻译得不错哦!

7. Flot

7. Flot

Flot 是最古老的图表库之一,围绕着用法简单并聚焦交互特性。它是特定的 jQuery 库,这意味着你需要使用它需要熟悉基础的 jQuery。但是从另一方面来说,这意味着你可以全面控制呈现,动作和用户交互。

Flot 兼容大多数现代浏览器,向下兼容到 IE6。Flot 的插件库提供许多类型的图,所有贡献都是社区提供的。你可以看看这些由 Flot 制作的例子。

协议: 开源,面向所有用户免费。

无若
 翻译得不错哦!

8. D3.js

8. d3

D3通常是提到数据可视化时出现的第一个名字。它是一个非常强大的开源项目,可以通过动态更新DOM创造出惊人的视觉效果和图形。另外,它使用HTML,CSS和SVG。

它符合W3C标准,并且是跨浏览器兼容的。开发者们往往喜欢它所带来的许多特征,比如“进入和退出”以及强大的过渡。你可以到这里找到一些 D3 的示例

需要说明的是,它没有预建图表,即时学习基本的图表也有一条非常陡峭的学习曲线。但开发者们是极富创新性,开发出了不少基于D3的包装库。后面我们将涉及到其中的一些佼佼者。

源码许可证: 开源。免费使用。

Garfielt
 翻译得不错哦!

9. n3-charts

9. n3-charts

如果你正在寻找一种在 AngularJS 应用下创建简单互动线图的方法,这将是你所需要的。N3 基于D3.js 针对小量受众–基于 AngularJS 绘制通用线图。如果你需要更多的图表类型,它可能不适合你。你可以在这里看到一些N3线图的实例。

源码许可证:开源。对所有人免费。

10. NVD3

10. nvd3

NVD3是一个旨在建立可复用的图表和组件的 d3.js 项目——它提供了同样强大的功能,但更容易使用。它可以让你处理复杂的数据集来创建更高级的可视化。

源码许可证:开源。对所有人免费。

Garfielt
 翻译得不错哦!
本文中的所有译文仅用于学习和交流目的,转载请务必注明文章译者、出处、和本文链接
我们的翻译工作遵照 CC 协议,如果我们的工作有侵犯到您的权益,请及时联系我们
评论(34)
Ctrl/CMD+Enter

居然没有ECharts,真不科学
du熊的ECharts呢??

引用来自“Frank_mc”的评论

居然没有ECharts,真不科学
居然没有echarts确实不科学
竟然没有vis
赞,干货。
没有Echarts 真心不科学
连Echarts 都没有,自己面壁去
mark
老外整理的东西,其实很多都不如Echarts
mark
Echarts呢?不支持国产了吗?

引用来自“Frank_mc”的评论

居然没有ECharts,真不科学

引用来自“听你的难过陪你沉默”的评论

居然没有echarts确实不科学
居然没有echarts实在不科学

引用来自“Frank_mc”的评论

居然没有ECharts,真不科学

引用来自“听你的难过陪你沉默”的评论

居然没有echarts确实不科学

引用来自“穿云箭OL”的评论

居然没有echarts实在不科学
居然没有echarts实在不科学

引用来自“Frank_mc”的评论

居然没有ECharts,真不科学

引用来自“听你的难过陪你沉默”的评论

居然没有echarts确实不科学

引用来自“穿云箭OL”的评论

居然没有echarts实在不科学

引用来自“snowdream”的评论

居然没有echarts实在不科学
居然没有echarts实在不科学
说echarts的只是看过效果,没自己写过的人们吧。。呵呵
还是用HighChart比较多。。。
echarts的效果没得说,兼容性也好,当封装的不是很科学。D3的入门比较难,而且兼容性不是很好,但扩展性很强。echarts是符合国内国情的,d3是符合国外国情的,不用比来比去的。

引用来自“Frank_mc”的评论

居然没有ECharts,真不科学

引用来自“听你的难过陪你沉默”的评论

居然没有echarts确实不科学

引用来自“穿云箭OL”的评论

居然没有echarts实在不科学

引用来自“snowdream”的评论

居然没有echarts实在不科学

引用来自“xia0mk”的评论

居然没有echarts实在不科学
居然没有echarts实在不科学

引用来自“微笑de辛翼”的评论

说echarts的只是看过效果,没自己写过的人们吧。。呵呵
文章标题是最棒的,作为图表工具,难道不是要求表现效果么?图表程序的目的难道只是为了写好代码而写代码么?难道不是用优秀的交互界面来完成数据表现任务?
百度echarts绝对好使,唯一遗憾体积太大
顶部