数据可视化在社交媒体、杂志和网站上无处不在，以直观、准确的方式表达复杂的数据。然而，创建有效和精致的可视化即使对于专业人员来说也是一件具有挑战性的任务。仅仅是在图表的布局方面，需要创作者重复多次调整布局的参数，才能得到满意的结果。这个不断试错的过程不具有系统性，而且非常耗时。已有的图表自动布局方法来自于图表制作工具，它们基于预定义规则自动生成布局，然而这种方法可能产生次优的结果。该工作由香港科技大学可视化实验室和微软亚洲研究院合作完成， 提出了一种通过学习用户偏好实现图表布局自动推荐的方法。
该工作[1]首先对问题进行简化，将图表的范围限制在柱状图，而布局参数限制在长宽比、柱宽度、柱数量、柱朝向、标签旋转和标签最大长度（见图1）。为了解决用户难以给图表布局评分的问题，将原问题转化为学习排序的问题。通过收集大量图表布局成对比较的用户数据，训练布局的评分模型。
图1：两组图表布局实验设置，对象是柱状图，涉及到长宽比、柱宽度、柱数量、柱朝向、标签旋转和标签最大长度参数。
数据收集阶段包含四个模块，包括生成比较对的候选集、通过用户标注获得标签、训练评分模型和自适应比较对采样（见图2）。首先是生成图表布局对的候选集合。图表以Vega-lite作为基础，选用汽车数据集和棒球数据集生成数据。将所有参数（比如长宽比）均匀采样，得到大量的比较对候选集。然后让Mechanical Turk工人在两个图表中标记布局更优的。
图2：数据收集阶段
考虑到比较对的候选集合巨大，难以遍历所有可能的组合，因此需要筛选出那些最为重要的比较对。为此，作者提出两种采样方法，分别是重要性采样和基于梯度的采样。重要性采样的基本原理是如果含有某一个参数的某个特定值的图表总是在比较中”获胜”，那么该值采样的概率会上升。基于梯度的采样使用到评分模型，在模型梯度较小的地方减小采样的步长，并增加采样的频率。共有两组实验设置，第一组涉及到长宽比、柱宽度、柱数量，共采样1575个布局；第二组新增、柱朝向、标签旋转和标签最大长度，共采样87360个布局。通过大量的标注，最终第一组得到1177对，第二组得到1333对。
图3：成对比较的Siamase神经网络
模型使用的是经典的成对比较Siamase神经网络（见图3），输入是布局参数，输出是美学评分，loss函数使用的是成对排名loss [2]，定义为。训练得到的模型能够取得不错效果，图x展示的是与基础模型和人工定义的度量[3]比较。从图中可以看出，在两个任务上，基于Siamase模型的方法要优于RankSVM的方法。相比于人工定义的特征，Siamase模型也有更好的效果。
图4：Siamase模型在两组实验设置上的预测准确率，以及与基础模型和人工定义的度量比较。
为了进一步验证该工作提出的方法的有效性和可用性，作者提出两个应用场景和对应的任务，与四种方法进行比较。第一个应用场景是展示，用户需要不断地调整长宽比和柱宽度以得到一个满意的结果。第二个场景是适应性的可视化设计，图表的最大宽度确定，用户需要调整长宽比、柱宽、朝向和标签旋转角参数。四种方法分别是本文提出的方法，通过遍历所有布局的可能并选出分数最高的一个；人类基准，基于Vega-Lite的WYSIWYG编辑器；图表自动方法，Excel和Vega-Lite；随机方法。评估结果如下：
- 在任务1上，该工作的方法比其他三种方法更好，具有显著性差异。人类水平要优于图表自动方法，但是没有显著性差异。
- 在任务2上， 该工作的方法和人类水平类似，均要优于图表自动方法和随机方法。本任务和任务1在结果上的差异主要可能来自以下两个方面。首先是任务2更加复杂，涉及到的参数更多。这一点可以通过图x(B)中两组任务用户平均用时的差异看出。其次是任务2的训练数据相对较少，相比于87360个采样候选集，只有1333对训练数据，模型的潜力没有得到充分挖掘。
图5：两组用户实验的结果
总的来说， 该工作提出使用深度学习的方法，通过将评分问题转化为比较问题，学习用户的偏好，最终实现图表布局的自动推荐。
参考文献：
[1] Aoyu Wu, Liwenhan Xie, Bongshin Lee, Yun Wang, Weiwei Cui, and Huamin Qu. Learning to automate chart layout configurations using crowdsourced paired comparison. In Proceedings of the 2021 CHI Conference on Human Factors in Computing Systems (CHI ’21), 2021.
[2] Shu Kong, Xiaohui Shen, Zhe Lin, Radomir Mech, and Charless Fowlkes. Photo aesthetics ranking network with attributes and content adaptation. In Proceedings of the European Conference on Computer Vision, pp. 662–679, 2016.
[3] Peter O’Donovan, Aseem Agarwala, and Aaron Hertzmann. Learning layouts for single-page graphic designs. IEEE Transactions on Visualization and Computer Graphics, 20(8):1200–1213, 2014.
评论关闭。