数据可视化技术

Posted 2023-03-06

【中文标题】数据可视化技术

【英文标题】：Techniques for Visualizing Data

【发布时间】：2011-02-06 23:54:35

【问题描述】：

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

SVG 或 Canvas 似乎是显而易见的选择（结合 JS 库——可能是 jQuery），但缺乏跨浏览器可用性是一个问题。我宁愿避免使用 Flash/Flex，但现在如果需要支持 IE7/8，它是我发现的唯一坚如磐石的跨浏览器技术。

是否有人有任何其他建议或任何其他信息可以使我列出的技术看起来更具吸引力？

谢谢。

【参考方案1】：

SVG 和 Canvas 适用于相对简单的数据（即几行就足够了）。对于复杂的数据（例如，频率分布，或者每个像素发出一个样本的情况），您应该在服务器上渲染一个正常的图像。

【讨论】：

目前，我试图避免性能问题（我假设这是您建议渲染图像的原因）。当然，当/如果性能成为问题时，我们将不得不做一些事情来“缓存”输出，这可能是创建图像并消除实时准确性。如果您有其他原因，请详细说明。

正如我所说，这取决于数据。如果渲染超过 10,000 行，SVG 和 Canvas 将开始变慢，因为您需要解析 1MB 的文档来获取坐标，而图像只需要 100KB。

【参考方案2】：

HighCharts 是一个 javascript、优秀、免费的跨浏览器图表工具。

看看Highcharts demo

【讨论】：

光滑的东西，但似乎只支持传统的图形。我需要支持云组、分形等。相同的想法，但在视觉上超出了传统的图形包模型。

【参考方案3】：

如果您使用 jquery 进行绘图，我肯定会查看 Flot 作为跨浏览器绘图/图表库。

【参考方案4】：

SVG 在除 IE 之外的所有设备上都可用，VML 在 IE 上可用（自 5.5，IIRC 起）。如果您可以同时提供 SVG 和 VML，那么您将拥有几乎每个人都可以看到的矢量图形。 RaphaelJS 是一个 Javascript 库，可以从相同的 Javascript 代码生成两种格式，但当然这只是一种方法。

Canvas 几乎可以在除 IE 之外的所有设备上使用，但有些疯狂的人写了一个名为 excanvas 的东西，它再次在 VML 中模拟 Canvas。从使用过它的朋友和同事那里，我听说它的性能比几乎任何其他浏览器图形解决方案都要差，但如果你想便携式地制作位图图形，它几乎是城里唯一的非插件游戏。

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

【讨论】：

我的意图是走矢量路线。因为这是一个解决本土问题的本土解决方案，我真的想避免同时实现 SVG 和 VML，但如果我能找到一个好的包来这样做......

【参考方案5】：

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

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

【讨论】：

这些都在列表中。谢谢。

我想我要从拉斐尔开始。它是跨浏览器的（阅读：它可以在 IE 中运行）并且看起来非常强大。

【参考方案6】：

您也可以试试 Protovis。 (http://vis.stanford.edu/protovis/)

【参考方案7】：

查看原文Processing.org。

他们使用 Java 小程序可能看起来很奇怪/不合时宜，但他们使用 Java 能够获得比 JavaScript 更好的性能。这些小程序似乎在任何地方都可以使用，而且您可以访问许多出色的 Java 库。

【参考方案8】：

不要以为我看到提到这个：JavaScript InfoViz Toolkit

我个人喜欢的一个有趣的可视化是treemap view。非常适合在单个视图中汇总大量数据。