有没有人会推荐一个特别的JavaScript图表库——特别是一个根本不使用flash的库?
如果你正在使用jQuery,我发现flot非常好-尝试一下示例,看看它们是否适合你的需求,但我发现它们可以满足我当前项目的大部分需求。
此外,ExtJS 4.0还引入了一组非常强大的图表,旨在处理实时数据。
尝试麻省理工学院的明喻时间轴,它可以做成一个图表- http://simile.mit.edu/timeline/
或者最后一个,http://code.google.com/p/gchart/
dojo图表库中有很多活动,最棒的是,我在一个AIR应用程序中使用它也没有问题,非常酷! 例如http://www.sitepen.com/blog/2008/05/27/dojo-charting-event-support-has-landed/
我推荐gRaphaël的纯JavaScript图表以及它所构建的纯JavaScript矢量图形库(Raphaël)。
gRaphaël目前支持Firefox 3.0+, Safari 3.0+, Opera 9.5+和Internet Explorer 6.0+。
查看http://www.highcharts.com !
Highcharts是一个纯JavaScript编写的图表库,提供了一种简单的方式来添加交互式图表到您的网站或web应用程序。Highcharts目前支持直线,样条,区域,区域线,柱状,条形,饼状和散点图类型。
有越来越多的纯JavaScript图表的开源和商业解决方案不需要Flash。在这个回答中,我将只介绍开源选项。
对于不需要Flash的图像,有两类主要的JavaScript解决方案:
基于画布的,在IE中使用ExplorerCanvas渲染,这反过来依赖于VML 基于标准的浏览器上的SVG,在IE中呈现为VML
这两种方法各有利弊,但对于图表库,我推荐后者,因为它与DOM集成得很好,允许使用DOM操作图表元素,最重要的是设置DOM事件。相比之下,Canvas图表库必须重新发明DOM轮来管理事件。因此,除非您打算构建没有事件处理的静态图形,否则SVG/VML解决方案应该更好。
对于SVG/VML解决方案,有许多选项,包括:
Dojox图表,如果您已经使用了Dojo工具包,那就很好 Raphael-based解决方案
Raphael是一个非常活跃,维护良好,成熟的开源图形库,具有非常好的跨浏览器支持,包括IE 6到8,Firefox, Opera, Safari, Chrome和Konqueror。Raphael不依赖于任何JavaScript框架,因此可以使用Prototype, jQuery, Dojo, Mootools等…
有许多基于拉斐尔的图表库,包括(但不限于):
gRaphael, Raphael图形库的扩展 Ico,具有基于单个函数调用的直观API来创建复杂的图表
披露:我是github上Ico分支之一的开发者。
jqPlot很棒。如果你的需求相当“正常”,你只是想画一些图表,你可能会被大量的js图表选项所淹没。假设您不想花费数小时进行研究,那么就使用jqPlot,因为它可能是您最好的选择。它很好地涵盖了大多数人的大多数用例。一些替代方案专门针对特定类型的图表,或者根据特定的用例构建。
一个框架:http://www.simile-widgets.org/
一个基本的:http://www.filamentgroup.com/examples/charting_v2/index_2.php
好看:http://www.highcharts.com/
还有另一个基于SVG的javascript库。它被称为Protovis,来自斯坦福可视化小组
它还允许制作漂亮的交互式图形和可视化。
http://vis.stanford.edu/protovis/ex/
尽管它只适用于现代网络浏览器
更新:protovis团队已经迁移到另一个名为d3.js(数据驱动文档)的库,正如他们所说:
Protovis团队现在正在开发一个新的可视化库D3.js,改进了对动画和交互的支持。D3建立在Protovis的许多概念之上。”
新库现在可以在以下地址找到:
http://mbostock.github.com/d3/
更新2:
“Rickshaw”是一个用于创建交互式时间序列图的JavaScript工具包。基于d3.js,这大大简化了d3.js的工作,尽管功能有点不强大。
http://code.shutterstock.com/rickshaw/
Sencha收购了Raphael,现在他们的图表是纯javascript版本4。上面提到的Emprise和HighCharts是我最喜欢的两个。
http://www.sencha.com/
看看ZingChart HTML5 Canvas, SVG, VML和Flash图表。非常强大和兼容的库。我是Zing团队的一员-在twitter上提到我们@zingchart或发送任何问题到support@zingchart.com。
我最近正在寻找一个javascript图表库,我评估了一大堆,最后确定了jqplot,它非常符合我的要求。正如Jean Vincent的回答所提到的,你需要在基于canvas和基于svg的解决方案之间做出选择。
To my mind the major pros and cons were as follows. The SVG based solutions like Raphael (and offshoots) are great if you want to construct highly dynamic/interactive charts. Or if you charting requirements are very much outside the norm (e.g. you want to create some sort of hybrid chart or you've come up with a new visualization that no-one else has thought of yet). The downside is the learning curve and the amount of code you will have to write. You won't be banging out charts in a few minutes, be prepared to invest some real learning time and then to write a goodly amount of code to produce a relatively simple chart.
If your charting requirements are reasonably standard, e.g. you want some line or bar graphs or perhaps a pie chart or two, with limited interactivity, then it is worth looking at canvas based solutions. There will be hardly any learning curve, you'll be able to get basic charts going within a few minutes, you won't need to write a lot of code, a few lines of basic javascript/jquery will be all you need. Of course you will only be able to produce the specific types of charts that the library supports, usually limited to various flavors of line, bar, pie. The interactivity choices will be extremely limited, that is to say non-existent for many of the libraries out there, although some limited hover effects are possible with the better ones.
我使用了JQplot,这是一个基于画布的解决方案,因为我只需要一些标准类型的图表。从我的研究和各种选择中,我发现它的功能相当全面(如果你只追求标准图表),而且非常容易使用,所以如果你的要求相似,我会推荐它。
总而言之,简单且需要图表,然后使用JQplot。复杂/不同,时间不紧迫,那就和拉斐尔和朋友们一起去吧。
http://code.google.com/apis/visualization/documentation/gallery.html
有非常酷的互动选项,包括地图,仪表和图表。
另一个是RGraph: Javascript图表和图形库:
http://www.rgraph.net
基于画布,所以速度很快,大概有20种不同的图表类型。非商业用途也是免费的!
我可以推荐arcadicharts。一个全新的专业的JavaScript和GWT图表库。在没有插件的所有浏览器中运行。简单和快速使用:创建伟大的外观图表,只需几行代码。 免费用于非商业用途。
如果你需要的只是柱状图。我发布了一些我一直在一个旧项目中使用的代码。有人告诉我,VML实现在最近版本的IE上被破坏了,但是SVG应该可以正常工作。可能会回到项目中,发布一些我已经拥有的服务器端渲染器,也许还有WebGL渲染层。有一个链接:http://blog.conquex.com/?p=64
我们刚刚为我们的新创业公司购买了techctave Charts Suite的许可证。我强烈推荐他们。发放许可证很简单。图表看起来很棒!它很容易上手,并且有一个强大的API供我们使用。我对代码的干净和可扩展性感到震惊。对我们的选择很满意。
作为某种迟来的回答,请尝试d3.js http://mbostock.github.com/d3/
这是原生视觉的延续。 与float的最大区别在于所支持的特性的数量。 虽然float可能更简单,但d3.js绝对更强大。
推荐文章
- AngularJS:工厂和服务?
- js:将一个组件包装成另一个组件
- 父ng-repeat从子ng-repeat的访问索引
- JSHint和jQuery: '$'没有定义
- 模仿JavaScript中的集合?
- 用JavaScript验证电话号码
- 如何在HTML5中改变视频的播放速度?
- 谷歌地图API v3:我可以setZoom后fitBounds?
- ES6/2015中的null安全属性访问(和条件赋值)
- 与push()相反;
- JS字符串“+”vs concat方法
- AngularJS使用ng-class切换类
- 访问Handlebars.js每次循环范围之外的变量
- 如何用JavaScript截屏一个div ?
- 如何为其他域设置cookie