给开发者提供的 35 款 JavaScript 图形图表库

jopen 10年前

        英文原文:35 JavaScript Chart and Graph Libraries for Developers

        图表是数据图形化的表示,也就是“通过形象的图表来展示数据,比如条形图,折线图,饼图”。几乎每个开发或者项目管理团队都需要图表或者图形来 简化理解,可视化复杂的数据和 web 应用工作流。可视化图表可以帮助开发者更容易理解复杂d数据,提高生产的效率和 web 应用和项目的可靠性。

        JavaScript 图表和图形库就是一个简单创建图表和图形的工具。现在互联网上有许多五花八门的 JavaScript 图表和图形库,帮助开发者们更好的创建 web 应用的图表和图形。

        在这篇文章中,我们罗列出排名前 35 的 JavaScript 图表和图形库,适合各种从简单图表到复杂图表的需求。大部分的 JavaScript 图表和图形库都是免费而且开源的,希望大家能在下面的列表中找到适合自己需求的 JavaScript 图表和图形库。Enjoy !!

        1. Planetary.js

给开发者提供的 35 款 JavaScript 图形图表库

        Planetary.js 是个令人称奇的创建交互式 web 地球仪的 JavaScript 库。它使用 D3 和 TopoJSON 来解析和渲染地理信息。Planetary.js 使用基于插件的架构,甚至默认自身就是个插件!这使得 Planetary.js 非常灵活,而且它是允许用户完全自定义,包括颜色,大小,rotation 等等。更重要的是,用户可以在任意位置使用自定义的颜色和大小来显示动画“pings”;它还支持鼠标拖动和缩放,100% 免费和开源。在线演示

        2. Ember Charts

给开发者提供的 35 款 JavaScript 图形图表库

        Ember Charts 是个图表库,使用 Ember.js 和 d3.js 框架构建的。它包括时间线,条形图,饼图和散点图,非常容易扩展和修改。这些图表组件都是开箱即用的,在图表交互和演示方面应用的很好。

        3. Chart.js

给开发者提供的 35 款 JavaScript 图形图表库

        Chart.js 是个简单的,面向对象的客户端图形库,用户可以用 6 中不同的方式来可视化数据。每个方式都是动画效果的,完全自定义,而且看起来非常好看,即使在 retina 显示。它使用 HTML5 canvas 元素,支持所有现代浏览器,并且支持  IE7/8。

        4. Aristochart

给开发者提供的 35 款 JavaScript 图形图表库

        Aristochart 是个高度自定义,灵活的折线 canvas 图表库,允许用户集中精力在图表的审美方面,后台工作做得非常好。Aristochart 有个持续进步的社区,提供许多不断增长的主题给用户选择。

        5. xCharts

给开发者提供的 35 款 JavaScript 图形图表库

        xCharts 是一个使用 D3.js 来构建漂亮的可定制的数据驱动的 JavaScript 图表库,他使用 HTML,CSS,SVG 实现图表,xCharts 被设计为一个动态的、流畅的、开放的和可定制化的库。

        6. BonsaiJS

给开发者提供的 35 款 JavaScript 图形图表库

        BonsaiJS 是个轻量级的 JavaScript 图形库,提供直观的图形 API 和 SVG 渲染器。主要特性包括:架构分离的运行器和渲染器;iFrame,Worker 和 Node 运行上下文;形状,路径,Assets(音频,图像,字体,subMovies),Keyframe 和常规动画,等等。支持现代化浏览器: Safari, Chrome 和 Firefox。

        7. Sigma.js

给开发者提供的 35 款 JavaScript 图形图表库

        Sigma.js 是个免费开源的 JavaScript 图形库,使用 HTML5 canvas 元素。它的设计是特别为了在 web 界面分享交互式网络 Map 和动态展示网络数据库。

        8. Morris.js

给开发者提供的 35 款 JavaScript 图形图表库

        Morris.js 是个轻量级的 JavaScript 库,使用 jQuery 和 Rapha&enuml 来绘制时序图。 Morris.js 生命周期是从代码驱动 howmanyleft.co.uk 图表开始的。它支持的浏览器有:  IE6+, Safari/Chrome/Firefox, iOS 3+ 和 Android 3+。它的公共 API 非常的小,只有一个函数: Morris.Line (选项),包括了许多配置选项。

        9. Paper.js

给开发者提供的 35 款 JavaScript 图形图表库

        Paper.js 是一个开源的向量图形脚本框架,基于 HTML5 Canvas 开发。提供清晰的场景图、DOM 和大量强大的功能用来创建各种向量图和贝塞尔曲线。

        10. AmCharts

给开发者提供的 35 款 JavaScript 图形图表库

        AmCharts 是个高级图表库,适用于所有数据的可视化。AmCharts 包括: Column, Bar, Line, Area, Step, Step without risers, Smoothed line, Candlestick, OHLC, Pie/Donut, Radar/ Polar, XY/Scatter/Bubble, Bullet, Funnel/Pyramid charts as well as Gauges.

        11. Smoothie Charts

给开发者提供的 35 款 JavaScript 图形图表库

        Smoothie Charts 是个极小的图表库,专为实时流媒体数据设计的。Joe Walnes 想展示 WebSocket 推动的实时的流数据。虽然很多图表库允许用户动态更新数据,但是没有一个是可以优化源源不断的流数据。

        12. Dygraphs

给开发者提供的 35 款 JavaScript 图形图表库

        Dygraphs 是个快速,灵活,开源的 JavaScript 图表库。它允许用户展示和解析密集的数据集。可以高亮需要强调的数据集。可以使用鼠标点击或者用鼠标拖动来缩放图表;可以修改数值或者点击条目来调整平均周期。

        13. Grafico

给开发者提供的 35 款 JavaScript 图形图表库

        Grafico 是 Grafico 是一个基于 Raphaël 和 Prototype.js 构建的 JavaScript 图表库,提供了各种图表类型。这些漂亮的图表,有利于传递他们的信息。

        14. Highchart JS

给开发者提供的 35 款 JavaScript 图形图表库

        Highcharts JS 是一个制作图表的纯 Javascript 类库,主要特性如下:兼容性:兼容当今所有的浏览器,包括 iPhone、IE 和火狐等等;对个人用户完全免费;纯 JS,无 BS;支持大部分的图表类型:直线图,曲线图、区域图、区域曲线图、柱状图、饼装图、散布图;跨语言:不管是 PHP、Asp.net 还是 Java 都可以使用,它只需要三个文件:一个是 Highcharts 的核心文件 highcharts.js,还有 a canvas emulator for IE 和 Jquery 类库或者 MooTools 类库;提示功能:鼠标移动到图表的某一点上有提示信息;放大功能:选中图表部分放大,近距离观察图表;易用性:无需要特殊的开发技能,只需要设置一下选项 就可以制作适合自己的图表;时间轴:可以精确到毫秒;在 RunJS 查看在线演示:http://runjs.cn/code/ih5xzoeb

        15. Flotr

给开发者提供的 35 款 JavaScript 图形图表库

        Flotr 是一个基于 Prototype 开发的 javascript 绘图工具。支持图例,鼠标跟踪,图片区域选择,图片缩放,添加事件钩子(event hook),通过 CSS 设置样式等。

        16. Flot

给开发者提供的 35 款 JavaScript 图形图表库

        Flot 是受 Plotr 和 PlotKit 的启发,Ole Laursen 基于 jquery 开发了一个图表绘制(WEB Chart)插件并命名为 flot。 flot 是个纯 JavaSript 库,专注于简单的使用方式,迷人的外观和交互式特性。支持的浏览器有: Internet Explorer 6+, Chrome, Firefox 2+, Safari 3+ and Opera 9.5+。

        17. jFreeChart

给开发者提供的 35 款 JavaScript 图形图表库

        JFreeChart  主要用来各种各样的图表,这些图表包括:饼图、柱状图(普通柱状图以及堆栈柱状图)、线图、区域图、分布图、混合图、甘特图以及一些仪表盘等等。JFreeChart 项目历史悠久,而且有大量的开发者在维护。

        18. Plotkit

给开发者提供的 35 款 JavaScript 图形图表库

        PlotKit 是一个纯 javascript 绘图工具包。它支持 HTML Canvas 和 Adobe SVG。有着很完整的文档,方便用户使用。

        19. JS Charts

给开发者提供的 35 款 JavaScript 图形图表库

        JS Charts 是个基于 JavaScript 的图表生成器,不需要任何编码。JS Charts 非常容易使用,只要用户使用客户端脚本(比如,在 web 浏览器中执行)。它不需要多余的插件和服务器模块,只需要下载 JS Charts 的脚本,准备好 XML,JSON 或者 JavaScript 数组数据。

        20. Canvasjs

给开发者提供的 35 款 JavaScript 图形图表库

        CanvasJS 是个易用的 HTML 5 & JavaScript 图表库,基于 Canvas 元素。Graphs 可以通过设备渲染,包括 iPhone,iPad,Android,Windows Phone,Microsoft Surface,Desktops 等等。它允许用户创建适用于所有设备,不影响 web 应用程序的功能和可维护性的富仪表盘。CanvcasJS 有着非常漂亮的主题和超过传统的 Flash 和 SVG 图表 10x 倍以上的速度——生成轻量级,漂亮和响应式的仪表图。

        21. Sparky

给开发者提供的 35 款 JavaScript 图形图表库

        Sparky 是个免费的 JavaScript 波形图库,依赖于 Raphaël ,非常容易使用。支持多个图表类型(折线,条形,area),折线和区域图可以有多个颜色选择。

        22. Envision.js

给开发者提供的 35 款 JavaScript 图形图表库

        Envision.js 是个 JavaScript 库,用来简化,快速创建交互式的 HTML5 可视化图表。它包括两个图表类型:时序图和 Finance ,提供 API 给开发者,用户可以直接自定义创建图表。这个库氏基于 Flotr2 和 HTML5 Canvas 的。它与框架无关,依赖于几个小的 JavaScript 库。

        23. Dc.js

给开发者提供的 35 款 JavaScript 图形图表库

        dc.js 是个 JavaScript 图表库,有着原生的 crossfilter, 支持和允许高效展示大型多维数据集(基于 crossfilter 的示例);图表使用 dc.js 渲染,是使用原生数据驱动,所以能得到用户的实时反馈;dc.js 最大的亮点在于能提供一个简单而强大的 JavaScript 库,能进行数据可视化和分析;不仅支持桌面浏览器还支持移动端。

        24. ElyCharts

给开发者提供的 35 款 JavaScript 图形图表库

        Elycharts 是一个易于使用的,可定制的 JavaScript 图表绘制组件。这个组件可用于绘制大部分常用的图表类型包括:line, column, are, bar, pie, sparklines and combinations。它支持多种交互式功能包括:鼠标跟踪、事件处理、利用各种动画高亮显示选择中的区域,Tooltip,HTML 锚点等。可以动态修改数据,并以漂亮的动画效果展示图表中的变化。图表利用 SVG/VML 技术生成,基于 jQuery + Raphaël开发。

        25. AwesomeChartJS

给开发者提供的 35 款 JavaScript 图形图表库

        AwesomeChartJS Awesome Chart JS 是一个 Javascript 生成图表的类库,它利用了 HTML5 的 canvas 标签来创建统计图表。此类库就是为了减轻开发者的工作量,使用它只需书写几行代码便能生成漂亮的图表。

        26. Arbor.js

给开发者提供的 35 款 JavaScript 图形图表库

        Arbor.js 是一个利用 Web Works 和 jQuery 创建的可视化图形库,它为图形组织和屏幕刷新处理提供了一个高效的、力导向的布局算法。

        27. CanvasXpress

给开发者提供的 35 款 JavaScript 图形图表库

        canvasXpress 是一个基于 HTML5 canvas 标签实现的 JavaScript 图表类库,它能够支持线性图、柱形图、饼图和热点图等多种常见的图表类型。它所生成的图表交互性很强,鼠标放上去时会动态显示值。除此之外,它也具有相当 高的可定制性,可设置图表的文字、颜色和要显示/隐藏的元素等。当然更重要的一点是,虽然它使用了 HTML5,但是依然支持 IE6 浏览器。

        28. JSXGraph

给开发者提供的 35 款 JavaScript 图形图表库

        JSXGraph 是一个支持各种浏览器的交互式几何图库绘制。JSXGraph 使用 SVG 和 VML.

        29. Rickshaw

给开发者提供的 35 款 JavaScript 图形图表库

        Rickshaw 是一个用于绘制时序图的简单 jS 库,基于 Mike Bostock’s delightful D3 库构建。

        30. rGraph

给开发者提供的 35 款 JavaScript 图形图表库

        RGraph 是基于 HTML5 canvas 标签的 HTML5 canvas 图形库,支持 20 种不同的可视化类型。使用 canvas 标签,RGraph 创建“HTML5 图表”,意味着更快的 web 页面加载和更少的 web 服务器加载。这能帮助减小 web 页面的大小,低能耗和更快的浏览速度。

        31. Fusion Chart

给开发者提供的 35 款 JavaScript 图形图表库

        FusionCharts Suite XT 是个专业的 JavaScript 图表库,能创建任何类型的图表。它创建的图表都是可以进行完全自定义的,标签,字体,边界等等,都可以进行修改。它有很强的交互功能,有许多信息提示,可 点击的 legend 关键字,还有 dril-down,缩放/滚动和单击打印图表功能。

        32. Graph Dracula

给开发者提供的 35 款 JavaScript 图形图表库

        Dracula 是用一系列的工具来显示和布局互动图表,包括各种相关的算法。它只是纯 JavaScript 和 SVG ,并无 Flash,Java,其他插件。它非常容易使用,用户可以很简单的自定义任意的元素。

        33. Bluff

给开发者提供的 35 款 JavaScript 图形图表库

        Bluff 是个 JavaScript 的 Ruby 的 Gruff graphing library 端口。它支持所有 Gruff 的特性,但是有着最小的依赖。用户只需要运行一个第三方脚本: JS.Class 副本(压缩后只有 2.6kB ) 和 Google 的 ExCanvas 副本,用来支持 IE 中的 canvas。这两个脚本在 Bluff 中都有下载。Bluff 自身压缩后大小大概有 11KB 。

        34. Pizza Pie Chart

给开发者提供的 35 款 JavaScript 图形图表库

        Pizza Pie Charts 是个响应式饼图图表,基于 Adobe Snap SVG 框架,通过 HTML 标记和 CSS 来替代 JavaScript 对象,更容易集成各种先进的技术。

        35. jGraph

给开发者提供的 35 款 JavaScript 图形图表库

        HTML5 图表组件,完全支持 l IE 6-8 和触屏设备。 JGraph 自 2001 年来就一直提供最先进的图表软件组件,是第一个流行的 JGraph Swing 库。然后在 2005 年走在时代的前沿开发 mxGraph。