导读
读完本文你会了解到：
1. 什么是时空可视化叙事
2. 时空可视化叙事的创作流程
3. 时空数据的可视化编码过程
4. 动画、标注和交互在时空可视化叙事中的应用
1. 前言
讲故事作为一种最生动有趣的方式，长久以来在人类历史中扮演着传递信息的角色；时空可视化叙事就是在地理场景下，使用可视化技术讲述故事，展示数据特征，让数据中的见解更好的传递给观众。
可视化叙事的创作流程可以简单概括为：1.数据收集整理、2.数据的可视化探索、3.数据的展示和呈现三个部分，其中第三部分是本次分享的主要部分，它涉及到数据的可视化的视觉设计、数据动画、主次安排和读者交互等方面的内容。
在前面的文章《Web 3D 地图中 CPU 和 GPU 动画的实现》中，我们分别讲到了地图中数据切换动画和镜头动画的实现，接下来我们就以一个案例来看看这些动画效果是如何在可视化叙事中使用的。
2. 作品和数据介绍
《走出雾霾》是使用哥伦布（雷尔平台自研的时空可视化叙事创作平台，未来会上线到互联网供大家使用）、P5.js、D3.js等工具创作的时空可视化叙事作品，作品使用ChinaVis2021大气污染再分析数据集，阐述了2013-2018年中国大气污染的分布特点、产生原因和治理过程。传送门：走出雾霾—过去6年中国大气污染的产生与治理【数据叙事】。
ChinaVis2021大气污染再分析数据集是中国科学院大气物理研究所等单位发布的我国《环境空气质量标准》中的6项常规污染物的网格化数据。该数据集提供两种时间分布率的数据，分别为日均值数据和小时值数据，本作品仅采用了2013-2018年的日均值数据，数据详情如表1所示。
表1: 大气污染再分析数据集日均值数据项介绍
3. 可视化编码和数据探索
对于时空数据，需要从时间和地理空间两个方面进行探索。在地理分布方面，我们从2013年入手探索污染的空间分布规律与产生原因；在时间分布方面，我们首先通过统计6年间每月污染天数，观察污染的变化趋势，最后结合地图、时间轴和新闻事件，了解污染的治理过程。
3.1 空间分布
由于数据样本是网格化的，一张地图上共有超过40000个采样点，而其中大部分的点并没有非常严重的污染，为了突出污染数据，弱化非污染数据，我们使用大小、颜色、透明度三种通道同时映射数据，弱化显示了AQI在100（轻度污染）以下的数据。图1所示为2013年AQI平均值的分布情况，从地图中可以看到2013年全国污染最严重的地方主要集中在华北地区。
图1 2013年平均AQI分布分布地图
污染的分布模式与地形和气候有很大关系，通过在地图上同时绘制出AQI、风场、湿度和地形等数据，我们观察到污染物容易随着风汇聚在山脉遮挡的地方。如图二所示是全国在2013年1月30日的风场和污染情况，其中紫色部分编码的是风场数据，橙色部分编码的是AQI数据。
图2 2013年1月30日全国污染和风向地图
AQI 是扬尘颗粒物、工业排放共同造成的结果，为了找到产生各类污染物的源头，我们分别探索了各类污染物的分布模式。如图3所示是PM10、SO2、CO和NO2在2013出现过的最大值的的分布地图，我们发现华北平原和新疆塔克拉玛干沙漠是全国污染最严重的两个区域，其中新疆污染主要是沙尘气候带来的，而华北地区的污染主要是工业燃烧和汽车尾气产生的。
图3 PM10（左上）、SO2（右上）、CO（左下）和NO2（右下）2013年最大值分布地图
3.2 时间分布
数据集的时间跨度比较长，为了能快速了解6年来的大致趋势，我们统计了每个月里6种污染物出现轻度污染、中度污染、重度污染和严重污染的天数，并以叶片、根系、花苞为设计隐喻表现污染数据的变化和污染物之间的关系（如图4所示）。
图5 多地在2013-2018污染天数数据比较
为了进一步理解这些数据特征背后的原因，我们结合污染数据和气象数据，设计了展示每年污染变化图，如图6所示是石家庄在2013年的污染变化情况，可以看到在冬季湿度较大的时候污染比较严重，到了夏季气温升高，污染逐渐减少但是臭氧却逐渐增加。
图6 石家庄2013年气象和污染数据
4. 数据的展示：动画、标注和交互
可视化叙事相对于可视分析来说，更加注重数据的展示。数据动画、必要的标注和交互可以帮助读者理解数据叙事作品中的主要观点。下面将结合《走出雾霾》来介绍关于数据展示的相关内容。
4.1 动画
动画因其吸引人的动态属性、连续的过渡引导在可视化叙事中有着广泛的使用，根据动画的使用场景，我们将动画分成两类：1.数据动画、2.镜头动画。
数据动画
数据动画是数据出现和消失时的过场动画，数据动画的形式需要根据数据本身的特点选择，在地图上我们使用了两种数据动画，分别是渐隐渐显和柱子涨落（如图7，8所示）。渐隐渐显主要表现污染数据的出现和消失，柱子涨落主要表现各省的统计数据。
图7 数据动画-渐隐渐显
图8 数据动画-柱子涨落
镜头动画
镜头动画通过镜头运动给故事增加叙事效果，不同的镜头运动能够产生不同的镜头语言，例如由远及近的推镜头，能够产生突出主要内容，展示数据细节以及内容与环境的关系等作用。在《走出雾霾》中，我们主要使用了四种运镜方式，分别是：推、拉、摇和综合运镜，其中“推”主要用于聚焦特定地点（如图9所示）、“拉”主要用于从特点地点返回到全国地图（如图10所示）、“摇”主要用于从地点A到地点B到视角转换（如图11所示）、“综合运镜”就是结合了镜头升降和镜头摇移等手法，来综合展示数据特点（如图12所示），在作品中主要用于展示煤炭消费数据和SO2污染数据的相似性。
图9 镜头语言：“推镜头”
图10 镜头语言：“拉镜头”
图11 镜头语言：“摇镜头”
图12 镜头语言：“综合运镜”
4.2 标注
标注在可视化叙事中扮演着非常重要的角色，它有着解释详细信息、突出高亮等作用。在作品中我们主要使用了三种标注类型：分别是点连线标注、区域标注和箭头标注（如图13所示）。在地图上点连线标注用于说明具体的地点，区域标注为了突出需要强调的区域，箭头标注主要为了指示风场的移动方向。
4.3 交互
在可视化叙事的作品中通常要考虑作者和读者的互动，偏向作者讲解的故事被称为作者驱动（Author-Driven）叙事，偏向读者探索的故事被称为读者驱动（Reader-Driven）叙事。例如视频、电影、PPT演讲等是典型的作者驱动叙事，而类似游戏、BI分析软件是完全的读者驱动叙事。
大多数网页上呈现的数据新闻都会采用读者驱动与作者驱动平衡的手法，在传递作者意图的同时，采用被动交互让读者确认作者的意图，从而使加深对作品内容的理解，这样的创作手法也被称为“马提尼酒杯”结构（如图13所示）：杯脚的小口代表作者的叙述，读者沿着被干进行探索，杯口处逐渐加宽，代表沿着作者的意图对叙事内容进行有限的探索以加深对作品理解。
图13 马提尼酒杯结构
《走出雾霾》最初是以视频为载体的叙事作品，在视频创作中并没有考虑读者交互，但在网页版设计的过程中，更多的读者交互被纳入进来。例如：叙述文案采用**滚动叙述（Scrollytelling）**的形式展开，用户可以通过鼠标滚动来控制故事的发展（如图14所示）；文案中也可以通过插入图片、链接和视频的形式辅助故事的讲解；视频中大量的标注被替换为读者交互，以帮助用户更好的理解作者意图（如图15所示）。
图14 滚动叙述的文本内容
图14 读者交互以确认数据内容
总结
《走出雾霾》是一次意义非凡的时空可视化叙事的创作实践，这次创作的目的是为了将可视化叙事中的叙事手法提炼为更加通用的叙事创作工具，让更多不熟悉代码的创作者也能轻松的制作可视化叙事作品。可视化叙事是作为可视化领域的一个新兴的研究课题，相比于传统的可视化更加关注数据的呈现和理解，在本次实践中我们尝试使用具备隐喻的视觉编码机制、丰富的数据动画效果、借鉴视频创作常用的镜头语言等等来让数据的呈现更加生动有趣，希望未来这款工具「哥伦布」能尽早和大家见面，带来更多有意思的可视化叙事作品。
