图 1 通过一系列布局操作生成的按客舱等级划分的泰坦尼克号幸存者的单元柱状图
介绍
单元可视化是常见的一类可视化模式，它的特点是将数据集中每一个数据项应用一个独自的视觉元素进行可视化映射。对于特定的数据集和可视化工作而言，单元可视化可能提供更多的信息，更合乎用户的心理模型，与传统的聚合可视化相比，反对新鲜的交互。然而现有可视化语法并不能全面的形容单元可视化，本文针对单元可视化，摸索了其设计空间，并且提出了单元可视化语法 – ATOM，通过递归地划分数据空间以及视觉空间的办法形容单元可视化。
关键词：可视化语法，单元可视化，设计空间，递归，数据空间，视觉空间
比照
劣势
与聚合可视化相比，单元可视化的劣势如下：
- 直观，单元可视化对于用户而言十分直观，缩小解释可视化时对数据抽象的思考。因为单元可视化将每一个数据属性映射到一个视觉元素，从而能够缩小用户认知与可视化之间的差距，同时帮忙用户发现子组中的离群值；
- 感知，单元可视化可能维持数据单元与视觉元素的一致性，因而在动画过渡的过程中可能帮忙用户跟踪视觉元素；只管人类跟踪动静的指标数量无限，然而通过感知属性答应用户在动画过渡期间跟踪所选的项，并取得该项挪动的总体成果。此外，属性还能够采纳视觉沉积隐喻的办法，其中数据项会随着工夫的推移而累积；
图 2 将视觉沉积隐喻利用在柱状图 (左)、饼状图(中) 和气泡图 (右)
图 3 视觉沉积的设计空间总结，工夫从右往左，1）数据流分块并存储在数据缓冲区，2）令牌创立，代表一个入口点，3）在力的作用下静止，令牌膨胀直到元素汇集，4）积淀，分层
- 构建视觉元素的物理属性，将一个独特的视觉标记与数据项关联，合乎老手应用物理标记思考和结构视觉示意的形式；
- 交互，单元可视化可能反对多种交互，包含过滤，查问等。属性的辨认确保了用户依据须要获取每个数据项的详情，过滤操作能够在元素级别，同时随同着动画视觉标记的显示或者暗藏；
- 显示可伸缩，只有当个别的视觉标记能被辨别时，单元可视化才有用。这意味着，每个视觉标记的大小是有限度的，绝对于以后的屏幕分辨率不能太小；
- 感知可伸缩 ，人类的感知零碎感知物体数量是无限的，更不应跟踪。对于某些工作，如比拟，数据对象数量较少，聚合可视化(如重叠条形图) 可能更优。
劣势
单元可视化也存在很多的问题，首先是计算复杂性，受限于内存，计算能力，以及渲染速度，单元可视化无奈反对对于大规模的数据。其次，单元可视化只有在每一个视觉元素可能被用户辨认的前提下才会有上述的长处，因而每一个单元可视化的视觉元素不能过小。同时，因为单元可视化的视觉元素不能过小，因而对于在视觉元素之间会导致互相的重叠从而造成的视觉遮挡的问题。
目前单元可视化没有被归类为独自的一类可视化办法，并且单元可视化的设计空间没有被系统地进行摸索，因而针对现存的两个问题，本文提出了一种高层次的语法规定形容单元可视化，它能够将单元可视化应用一个通用的框架进行形容，同时可能升高用户应用单元可视化的过程中所存在的编码累赘。
相干工作
只管单元可视化听起来比拟新鲜，然而已有很多单元可视化被专家学者提出，表 1 给出了可视化示意以及可视化零碎的代表成绩，能够被了解为单元可视化。
表 1 文献中已有单元可视化分类统计（局部）
图 4 单元可视化例子
单元可视化
单元可视化已在可视化畛域内自然而然呈现，许多变体基于启发式或直觉的形式倒退起来。本文形象出已有单元可视化示意的独特特色，提炼出一个通用的框架，使现有的可视化形容和新鲜的可视化设计都能采纳此框架实现。可视化语法在其余类型可视化示意的胜利利用，那么单元可视化也采纳相似的办法。
图 5 应用 ATOM 语法在泰坦尼克号数据集上实现的单元可视化示例，a）乘客舱位的单元条形图，b）乘客舱位、幸存者和性别的单元镶嵌图，c）按年龄划分的乘客舱位的单元 Violin plot。在每个图表中，蓝色圆点代表幸存者，红色圆点代表未幸存者
图 6 SandDance，可视化摸索，了解和展现你的数据
SandDance 应用单元可视化，该可视化将数据库中的行记录与屏幕上的标记之间通过一对一映射进行关联。视图之间的动画平滑过渡，帮忙用户在同数据交互时依然放弃其上下文。
可视化语法
可视化能够应用不同的抽象层次的工具来构建。为了从头开始反对通过编程实现可视化，专家和学者提出了许多可能提供根本原语的库，包含 Prefuse、Processing、D3 和 Protovis。然而，编程超出了许多人的能力范畴，须要应用大量的工夫关注实现细节，导致不能让设计师将精力集中在可视化视觉示意上。除了通用的可视化语法外，咱们还针对特定类型的可视化开发出畛域特定的语法。在设计高级语法的时，咱们须要在特定畛域的语法的紧凑性与其表现力之间做出衡量。通过比照剖析，Atom 中增加了几个原语，以反对更加宽泛的可视化表白。
高级语法
设计空间
单元可视化的设计空间次要从三个角度进行形容，别离是视觉空间、布局办法以及视觉元素。
- 视觉空间，视觉空间维度决定了视觉坐标系，通常包含分为一维，二维与三维坐标系；例如，点图示意一个数据维度，但须要二维可视空间；
- 视觉元素，分为物理定义的几何元素，矩形元素，以及圆形元素。其中矩形的视觉元素在非重叠类型的可视化模式中最为常见，因为它们须要起码的参数实现固定在视觉空间中，并且易于递归划分。圆罕用于重叠与非重叠的可视化模式，在散点图和点图中尤其常见；
- 布局办法，单元可视化的布局次要是决定在单元可视化中视觉元素的地位；布局形式次要分为重叠类以及非重叠类。在重叠类的单元可视化布局中，视觉元素的形态以及地位是独立的，因而视觉元素之间存在互相的穿插重叠，然而视觉元素之间的穿插重叠大大影响了单元可视化潜在劣势。除重叠类的布局之外，非重叠类的布局通过不相交地将视觉元素进行组织从而缩小视觉元素之间的穿插。对于视觉元素的组织是基于对于视觉空间进行正当的划分与组织实现的。对于视觉空间的组织次要有两种形式，一种是对于自顶向下地对于空间进行划分；另一种是自底向上的将视觉元素进行打包组织。
图 7 布局分类以及子容器可视化成果
描述性语法
在摸索了单元可视化的设计空间之后，基于其设计空间提出了 ATOM 的语法，从而反对对于单元可视化的不同角度的形容。本文对于单元可视化进行了定义，将其形容为一系列的子容器进行定义，每一个子容器蕴含一个视觉元素。因而单元可视化由视觉元素与子容器之间的元组对所形成，为了形成这些元组对，须要对于视觉空间以及数据空间进行一直地划分，将视觉空间划分到最小的子容器，将数据空间划分到最小的数据元素。
在对于数据空间以及视觉空间划分的过程中存在不同的操作。在数据空间中的操作包含 bin，duplicate，filter，以及 flatten。上面别离介绍这四种操作，bin 操作是依据数据的属性值对于数据空间进行划分，duplicate 操作是将数据进行复制，在不同的视觉空间汇总应用同样的数据；filter 是依据给定的条件对于数据集进行二部划分。flatten 是将每一个数据单元搁置到一个空间子容器中。
在视觉空间的划分能够组织成一个层次结构，在第一层划分为重叠式布局以及空间填充式布局。重叠式布局包含 Map2D，行将数据映射到二维空间中，以及 jittering，应用都抖动的办法去除元素之间的重叠。或者采纳叠加图形元素的形式，防止重叠；对于空间填充的布局办法，依照自顶向下以及自底向上的办法划分为 subdivision 以及 packing 两类，其中 subdivision 依照划分的维度分为一维（fillX，fillY）以及二维（treemap），packing 分为最大填充（maxFill）以及平均布局（uniform）两类。以上介绍了对于数据空间以及视觉空间的划分办法。对于数据空间别离采纳 Bin，flatten 等操作，对于视觉空间别离采纳 FillX 以及 Pack XY 的操作。最初通过 flatten 的操作将每一个子空间中搁置一个视觉元素失去最终的后果。
图 8 单元可视化数据空间和视觉空间划分过程
依据以上定义的视觉空间以及数据空间的操作，本文提出了 ATOM 的形式化的语言，将 ATOM 解构为 Root（单元可视化绘制的空间），Layout（单元可视化的布局，采纳递归的定义方法），Marks（单元可视化的视觉元素），其中 layout 蕴含了上述对于视觉空间以及数据空间的划分操作。同时本文提出了 shared property 管制视觉元素之间的大小是否雷同。
图 9 单元可视化形容语法
图 10 单元可视化语法定义案例
图 11 单元可视化语法定其余案例
总结
本文对于单元可视化进行形象语法的定义，用于 高维数据可视化，同时摸索了单元可视化的设计空间，并且提出了 ATOM 的形式化描述语言形容单元可视化。本文给咱们设计特定畛域可视化语言的启发如下：
- 同步性，单元可视化语法设计的准则将对数据空间和视觉空间操作联合在一起，缩小用户的应用门槛；
- 笼罩完整性，将自定义的高级语法，笼罩已有的语法形象较低级的单元可视化形式；
- 可扩展性，反对用户自定义布局函数，能够自在的扩大；
- 动画与交互，ATOM 定位是一种可视化标准语言，不反对交互和动画，针对简单场景的有必要提供通用的交互和动画，比方，元素级别的抉择、details-on-demand、过滤、高亮、焦点 + 上下文布局、高级导航和查问操作等。
图 12 解决重叠计划，下面是采纳透明度，上面采纳抖动
图 13 解决重叠计划 采纳升维度重叠的形式
参考
[1] ATOM: A Grammar for Unit Visualizations
[2] http://vis.pku.edu.cn/blog/atom_grammar/
[3] https://blogs.sas.com/content/iml/2011/03/04/how-to-use-transparency-to-overcome-overplotting.html
[4] https://blogs.sas.com/content/iml/2011/07/05/jittering-to-prevent-overplotting-in-statistical-graphics.html
[5] https://sanddance.js.org/
文章可随便转载，但请保留此原文链接。
十分欢送有激情的你退出 ES2049 Studio，简历请发送至 caijun.hcj@alibaba-inc.com。