这篇工作介绍一种将基本D3图表转换为可重用样式模板的技术。给定一个新的数据源，这篇工作应用样式模板来生成一个描述新数据的图表。为了构造样式模板，这篇工作首先解构D3图表中的：数据，标记和数据的映射。然后，这篇工作对解构出的映射的做感知有效性进行排序。要将生成的样式模板应用于新的数据源这篇工作们首先要获取每个新数据字段的重要性等级。然后，这篇工作调整模板映射以通过将最重要的数据字段与最感知有效的映射进行匹配来描述源数据。这篇工作展示了样式模板如何以数据表格或其他D3图表的形式应用于源数据。虽然这篇工作的实现侧重于为基本图表类型（例如条形图，折线图，点图，散点图等）生成模板，但这些是当前最常用的图表类型。用户可以很容易地在Web上找到这些基本的D3图表，将它们变成模板，并立即看到他们自己的数据在模板的视觉样式（例如颜色，形状，字体等）中的外观。这篇工作通过将多样化的样式模板应用到各种源数据集来证明这篇工作方法的有效性[3]。
图1: 系统概览图
这项工作的核心就是我们可以从网上获得一个图标，然后我们可以使用我们的数据源来替代图标中的数据。我们可以从图1中看到，该工作包括三步，首先解构图标提取出数据映射关系，然后对我们的数据源提取数据映射，最后将我们的数据源映射关系与图标中的数据映射关系进行匹配，然后替换相应的值。
图2: 解构图表
Step1 解构图表: 如图2所示，之前的Harper[1]的方法，分别提取dot，label和axis的映射关系，一共提取了3个映射关系。我们改进了该方法，一共提取出13中映射关系，对于轴我们可以划分为离散型和连续型的轴，轴内还可以分为label和ticks。我们可以在图1（a）中国呢看到提取出的映射关系，1表示映射重要程度最高，4表示映射的重要程度最低。我们使用Voyager[2]中提到的感知映射对重要程度进行排名。
Step2 提取源数据数据映射: 如图1（b）所示，我们需要将改表格中的数据替换图标中的数据，我们提取了数据中映射关系，然后用户可以预设映射的重要程度从上到下依次递减。
图3: 映射匹配
Step3 映射匹配: 我们源数据映射与图标数据映射进行匹配，我们将数据分为3类，离散型，数值型和序数型。如图3所示，我们是想将源数据映射与图标数据映射的重要成都排序，然后按照数据类型进行匹配。
图4: 结果
可以在图4中看到这篇工作方法的结果，第一行表示输入的源数据，可以说表格或者图标，第一列表示我们可重用的可视化模板。我们可以看到红色框重的结果不是很好，是因为模版中的X和Y维度的数据都是数值型的，但是源数据的X和Y维度一个是数值型的一个是序数型的，导致了不好的匹配结果。
[1] Harper J and Agrawala M (2014), “Deconstructing and Restyling D3 Visualizations”, In Proceedings of the 27th Annual ACM Symposium on User Interface Software and Technology. New York, NY, USA , pp. 253-262. ACM.
[2] Wongsuphasawat K, Moritz D, Anand A, Mackinlay J, Howe B and Heer J (2016), “Voyager: Exploratory Analysis via Faceted Browsing of Visualization Recommendations”, IEEE Transactions on Visualization and Computer Graphics., Jan, 2016. Vol. 22(1), pp. 649-658.
[3] Harper J and Agrawala M (2017), “Converting Basic D3 Charts into Reusable Style Templates”, IEEE Transactions on Visualization and Computer Graphics. Vol. PP(99), pp. 1-1.
评论关闭。