2010-04-12 114 views
9

我正在研究提供几种可视化大量数据的方法。这可能包括但不限于简单的图表。我正在探索的技术将涉及形状,文字和线条。它还将涉及与这些元素的元素(隐藏,聚焦等)和动画(移动,拖动,系统重组等)的交互。用于可视化数据的技巧

SVG或Canvas看起来像是一个明显的选择(与JS库 - 可能是jQuery一起),但缺乏跨浏览器可用性是一个问题。我想宁愿以避免Flash/Flex,但现在它是我发现的唯一的坚如磐石的跨浏览器技术,如果支持IE7/8是必需的。

有没有人有任何其他建议或任何额外的信息,使我列出的技术似乎更具吸引力?

谢谢。

回答

1

你可能想看看RaphaelGRaphael。 Raphael允许您创建矢量图形,并将在支持SVG的浏览器上使用SVG,同时自动切换到IE上的VML。

您还可以看看基于画布的processing.js

+0

这些都在列表中。谢谢。 – 2010-04-12 17:47:59

+0

我想我会从拉斐尔开始。它是跨浏览器(阅读:它将在IE中工作),似乎非常强大。 – 2010-04-14 18:56:39

0

SVG和Canvas适用于相对简单的数据(即几行就足够了)。对于复杂的数据(比如频率分布,或者每个像素发射一个样本的东西),您应该在服务器上渲染一个正常的图像。

+0

目前,我试图避免性能问题(我认为这是您提出渲染图像的原因)。当然,当性能成为问题时,我们不得不做一些事情来“缓存”输出,这可能会创建一个图像,并消除实时精度。如果您有其他理由,请详细说明。 – 2010-04-12 13:01:16

+0

正如我所说,这取决于数据。如果渲染10,000多行代码,SVG和Canvas将开始变慢,因为您需要解析1MB文档以获取坐标,而图像只需要几百KB。 – 2010-04-12 15:34:24

1

HighCharts是一个Javascript,良好的免费和跨浏览器制图工具。

看看在Highcharts demo

+0

流畅的东西,但似乎只支持传统的图形。我需要支持云组,分形等。相同的想法,但在传统的图形包模型外面。 – 2010-04-12 13:02:48

0

如果您正在使用jquery的图表,我会definiately退房Flot这是跨浏览器的图形/图表库。

1

SVG在IE以外的所有应用程序上均可用,并且VML可在IE上使用(自5.5,IIRC以来)。如果您可以同时提供SVG和VML,您将拥有几乎每个人都可以看到的矢量图形。 RaphaelJS是一个Javascript库,可以从相同的Javascript代码生成这两种格式,但当然这只是一种方法。

除了IE之外,Canvas几乎都可以使用,但是一些疯狂的人写了一些叫做excanvas的模拟Canvas的东西,同样也是VML。从我使用过它的朋友和同事那里,我听说其性能比任何其他浏览器图形解决方案都要糟糕,但如果你想做可移植的位图图形,它几乎是城市中唯一的非插件游戏。

你采用哪种路线 - 矢量或光栅 - 实际上取决于你的应用程序。

+0

我的意图是去矢量路线。因为这是一个本土解决方案来解决本土问题,我真的希望避免实现SVG和VML,但是如果我可以找到一个很好的包... – 2010-04-12 15:10:42

2

查看原始Processing.org

他们使用Java小程序似乎很奇怪/不合时宜,但他们能够比JavaScript更好地获得Java的性能。小程序似乎可以在任何地方工作,并且您可以访问许多优秀的Java库。