看一组很酷的动画图表合作导师为王运海教授

看一组很酷的动画图表:

发表演讲和报告，放在门户网站首页不是很醒目吗。

一定很难制作吧。

不！很简单:你不用写一行代码！

只需在下面的图形界面中导入你的图表的一个SVG文件，然后用鼠标拖动图表单元来设置出现时间和动画效果。

数据始终与动画保持一致，不需要计算和实现动画背后的各种复杂机制。速度，形态，慢速功能等参数都为你安排好了:

在动态图表快速实现的背后，有一个可视化动画的声明性语言——Canis。

它不依赖任何第三方图书馆，由北京大学陈宝泉教授的弟子童歌提出童歌刚刚在山东大学成功卫冕博士，合作导师为王运海教授

它也是第一个为构建视觉动画提供全面支持的领域特定语言。

陈教授还称赞自己开发了这样一个多层次的系统。

除了上述功能，平台还支持多种图表:无论你做什么，都可以在这里制作动画。

除了导出mp4文件并将其应用于日常场景之外，如果您是一名开发人员——，它将非常棒，而且是量身定制的:

它可以导出洛蒂动画的JSON格式，帮助你跨iOS，安卓，Web等平台轻松使用。

第一个视觉动画构造语言。

在图形学的背景下，童歌的研究方向是数据可视化，这可以大大提高信息传输的效率。

可是，他发现市场上制作相关动画的工具不够方便。

比如有些类库要求用户手动计算动画中的每个时间节点，通过调整底层视觉通道的状态来实现动画效果。

比如大家都很熟悉的Matplotlib和Pandas功能强大，但是需要你一行一行写代码才能做出效果。

这些对不会编程的用户非常不友好。

而创作动画的专业工具在制作动画图表时不需要编程，操作过程也比较繁琐:需要逐帧制作，动画和数据是分开的，没有办法保证结果的一致性。

然后利用所学知识创建一个数据驱动的可视化动画图表创建工具。

起初，童歌准备直接创建一个去编程平台。

但他在早期的探索和尝试中发现，如此复杂的系统内部，需要一个严谨的，支持性的规则来描述各种图表的各种动画形式，以及相应的编译和渲染机制。

因此，他们开始从广义上研究动画理论，然后结合可视化的特点以及视觉动画在应用过程中的一些规律和特殊结构特征，探索如何在语法上合理地编码和体现这些特征。

最后，设计了DSL语言Canis。

童歌介绍，这也是整个项目中最难的一步，之前也没有相关研究。

最后，他们提出的Canis有一套完整的体系，包括声明性语法规范，数据驱动的动画声明和编译机制，不依赖任何第三方库。

他们的第一个成果是通过Canis编程直接实现了动画的在线平台:

借助数据，平台管理图元，定义动画时序结构和动画效果。

从而实现了可视化动画中数据，视觉编码和时序之间关系的建立，保证了动画和数据的一致性。

一开始我们需要导入一个图表，格式是SVG的变体dSVG。

它向文件中每个元素对应的标签添加了三个附加属性:id，class和datum。

其中，id和class为图元提供索引，描述图元类型。)，

而数据包含对应于这个原语的源数据内容(下图最左边)。

通过它们，Canis可以自动建立图元之间的关系，进而可以定义图元的动画效果。

因为Canis将编码和实现逻辑解耦，所以用户只需要定义做什么，而不需要定义如何做。

你只需要填写选择器，分组，定时，转场效果等参数(具体语法请参考Canis在线平台的类型文档)

例如，在下面的气泡图中，通过将类型设置为淡化，可以通过淡化来切换气泡的数据状态。

如果你觉得这个有点生硬，——就把褪色改成魔动。

此时，Canis编译器会在状态之间进行插值，实现平滑的变形变换，不需要设置其他参数。

例如，通过更改分组所基于的数据属性，可以快速更改动画时间序列，并将下表中的划分基准从类型更改为月份。

说到Canis编译器，就是用JavaScript写的。为了支持高效的跨平台渲染和应用，代码将通过以下五个步骤编译成洛蒂代码:

在编译过程中，中间变量以数据表的形式存储和维护，就像这样:

增加更友好的自动补全算法界面。

虽然卡尼斯的

语法简单，但一个真正用户友好的平台还是尽量避免直接进行代码控制，于是他们的第二个成果就出来了:

基于 Canis 做了一个不需要编码的图形界面，就是文章开头看到的那个，葛彤将其命名为 CAST(Canis Studio)。

CAST 采用了直观描述动画过程的视觉规范，对 Canis 编译器进行了优化，提供了增量式编译的支持，以提高交互渲染效率。

用户在界面中的交互行为会被翻译为相应的动画调整指令，用以生成和更新系统内部所维护的 Canis 对象，而 Canis 对象的更新又会实时的在界面中反馈给用户。

除了增量编译，CAST 还增加了数据驱动的自动补全算法，以帮助用户更快捷地完成动画制作。

主要包括两方面内容:

一是关键帧的自动补全。

这主要是为了解决在构建关键帧的过程中，一些过小或与其他重叠的图元导致选择过程十分困难且错误率较高的问题。

CAST 的做法是在用户选择少量图元之后，根据视觉通道的感知有效性，对已选和未选图元所对应的数据属性编码的视觉通道进行对比。

之后根据编码感知有效性最高的通道的数据属性(如相比使用颜色，用位置信息所编码的数据属性更容易被人发现和观察)，对未选图元进行分组和筛选并反馈给用户，如下所示。

二是动画序列推荐补全。

在用户完成少量关键帧的构建后(如完成第一帧后)，CAST 依旧是会依据视觉通道的感知有效性原则，根据用户已经创建的关键帧中的图元，对全部的图元进行分组以创建后序的关键帧。

并依据数据属性各种可能的排列组合顺序生成可能的关键帧序列。

之后对比序列内容找到关键帧差异位点，反馈给用户进行选择，以确认最终用户所预期的动画序列。

在上面这个示意图中，预期动画为颜色相同的点簇按照先行后列的方式进行动画。

用户在创建完第一个关键帧之后，仅需通过两次关键帧的选择(第二帧和第三帧)系统便可确定唯一的动画序列进行自动补全。

至此，第一个专门为可视化动画而研究和设计的系统就暂时完成了。

在被问及到未来还会对 Canis/Canis 做什么更新或改进时，葛博士表示，可以添加 gif 导出功能，来进一步提升实用性。

另外，对于 Canis 而言，考虑将其扩展为一个通用性更强的插件库，使其能够嵌入任何常见的可视化创作语言中，完成可视化与动画的创作过程的融合，

对于 CAST 则是考虑通过嵌入预处理模块，将其与图形化的可视化构建工具进行对接或融合以达到相同的目的。

葛彤，即将从山东大学博士毕业，为 Canisamp，CAST 这两篇论文的一作，

导师为陈宝权(北京大学教授，前沿计算研究中心执行主任，IEEE Fellow)和汪云海(山东大学计算机学院教授)。

之所以选择数据可视化作为研究方向，葛博士表示:

一方面是平时比较喜欢去写一些能够解决工作或者生活中的实际问题的小程序，另一方面是爱好画画和做设计。

在了解数据可视化的过程中，会被那种严谨的美感所吸引，同时它又在数据分析的过程中扮演着越来越重要的角色，切实的解决着我们身边的问题。

而除了他的两位导师，还有很多研究人员对 Canisamp，CAST 的完成作出了贡献:

比如微软雷德蒙研究院的研究员 Bongshin Lee，她是人机交互和可视化领域有影响力的专家，

还有山东大学的 Zhao Yue，加州大学圣巴巴拉分校博士毕业的 Ren Donghao 等人。

最后，葛彤表示，Canis/CAST 是一个开源项目，希望有更多的人加入进来，把这个做的越来越完善，在各个领域的应用中产生影响。

在线平台:

论文地址: