简介:基于 Adobe Flex 的并置表(juxtaposition table)是一个二维可视化辅助工具,可 用于排列、分类和比较大量数据。使用并置表可以在一个方便紧凑的视图中定义自己的透视图。本文演 示如何动态地创建表的列和修改表的内容。此外,您还将了解到如何在一个单元格中显示多个项,以及 如何改变单元格的形状和颜色。
简介
为了减轻非 IT 专业人员(比如业务顾问)的负担,我们将构建带有类似于 Microsoft PowerPoint 的演示特性的原型建模工具,以帮助业务顾问组织大量非结构化数据,并 为客户准备演示文档。我们的工具的第一个版本基于 Eclipse。不过,为了利用更佳的图表功能,我们 决定转向 Rich Internet Application 技术。 我们考虑了流行的 Ajax 和 Adobe Flex 的优缺点,最 终决定使用 Flex。
我们的基于 Flex 的应用程序允许用户使用各种可视化辅助工具创建幻灯片,包括项列表、图表编辑 器、标记云、关系搜索器和表。在本文中,我们将解释一个特殊的辅助工具,它允许用户排列、分类和 比较大量数据。我们将这个辅助工具称为 “Juxtaposition Table” 或 JTable。借助 JTable,用户可以将数据可视化为二维视图,并且在运行时交互地更改水平和垂直数据集。该工具支持 从一个简单视图中包含的各种用户定义透视图检查数据库或信息空间。
在查看代码之前,我们先 介绍基础的场景,我们在该场景中扮演一个调查中心,负责研究公众喜欢的图书、电影、歌曲和站点的 品味。一个调查组可以包含任意数量的参与者和可扩展的调查类别列表。为简单起见,我们采用很小的 调查组。参与者是:John、Jennifer 和 Ivan。在完成调查之后,我们将结果传输到一个简单的数据库 中。现在,我们希望这些结果能够显示在我们的 Web 站点中以供查阅。我们可以提供一个很大的 HTML 表来储存调查结果,但它在用户眼前会非常杂乱,因为表太大导致信息非常密集。我们也可以提供多个 表,以从多个预定义的透视图中显示数据。不过,这种方法也不理想,因为用户被局限在我们预定义的 表中,并且在多个表之间滚动可能令人烦恼。
采用 JTable 可以实现一个出色的解决方案。如果 我们在 JTable 中显示数据,用户就可以更改水平和垂直的数据集,从而根据自己的信息需求选择定制 的透视图。例如,用户可能希望了解 John 最喜欢的图书;这样,就可以选择 “John” 作 为表的水平维度,选择 “Favorite Books” 作为表的垂直维度。用户也许希望了解调查参 与者最喜欢的电影。类似地,可以选择 “All People” 作为表的水平维度,选择 “Favorite Movies” 作为表的垂直维度。通过使用 JTable,用户可以在一个方便紧凑的视 图中定制自己的透视图。要运行 JTable 应用程序,可以在下面的 下载表 中下载 DataGridDeveloperWorksExample1。运行 JTable 应用程序之后,您就可以以各种组合方式查看调查的 结果。
我们使用 Flex 的 AdvancedDataGrid 组件来实现 JTable。在这个分为两部分的系列文 章中,我们将演示如何定制和扩展在 Flex 3 数据可视化包中提供的 AdvancedDataGrid 组件。在本文 中,我们还演示如何使用水平和垂直控制条在运行时修改 JTable 的内容,以及如何将表的第一列和第 一行转变成列标题栏和行标题栏。在第 2 部分中,我们将演示在单元格中流畅地扩展和收缩项,以及以 拖放的方式在单元格之间移动项。
本系列文章假设读者熟悉 Flex 编程环境和 ActionScript 语言。