我多次被炫目的数据可视化或信息可视化震惊,在我知道这些图片背后的数据来源和创造历程后,更是为之诧异不止。它涉足制图学、图形绘制设计、计算机视觉、数据采集、统计学、图解技术、数型结合以及动画、立体渲染、用户交互等。相关领域有影像学、视知觉。空间分析、科学建模等。
这是创造性设计美学和严谨的工程科学的卓越产物。用极美丽的形式呈现可能非常沉闷繁冗的数据,其表现和创作过程完全可以称之为艺术。所以我翻译了来自SM上的3篇数据可视化和信息图形的文章,主要是鉴赏并提供一些参考资料。我尽量查找了每张数据图表背后的背景,添加了标注和说明,希望那个帮助读者更深入地理解这些图表所呈现的含义,而不仅仅是停留于对“好看”的赞叹上。这些图片不会说话,但它们比文字和语言都更为有力。
数据可视化 Data Visualization 和信息可视化 Infographics 是两个相近的专业领域名词。狭义上的数字可视化指的是讲数据用统计图表方式呈现,而信息图形(信息可视化)则是将非数字的信息进行可视化。前者用于传递信息,后者用于表现抽象或复杂的概念、技术和信息。
而广义上的数据可视化则是数据可视化、信息可视化以及科学可视化等等多个领域的统称。
数据可视化起源于1960s计算机图形学,人们使用计算机创建图形图表,可视化提取出来的数据,将数据的各种属性和变量呈现出来。随着计算机硬件的发展,人们创建更复杂规模更大的数字模型,发展了数据采集设备和数据保存设备。同理也需要更高级的计算机图形学技术及方法来创建这些规模庞大的数据集。随着数据可视化平台的拓展,应用领域的增加,表现形式的不断变化,以及增加了诸如实时动态效果、用户交互使用等,数据可视化像所有新兴概念一样边界不断扩大。
而我们熟悉的那些饼图、直方图、散点图、柱状图等,是最原始的统计图表,它们是数据可视化的最基础和常见应用。作为一种统计学工具,用于创建一条快速认识数据集的捷径,并成为一种令人信服的沟通手段。传达存在于数据中的基本信息。所以我们可以在大量PPT、报表、方案以及新闻见到统计图形。
但最原始统计图表只能呈现基本的信息,发现数据之中的结构,可视化定量的数据结果。
面对复杂或大规模异型数据集,比如商业分析、财务报表、人口状况分布、媒体效果反馈、用户行为数据等,数据可视化面临处理的状况会复杂得多。
可能要经历包括数据采集、 数据分析、数据治理、数据管理、数据挖掘在内的一系列复杂数据处理,然后由设计师设计一种表现形式,是立体的、二维的、动态的、实时的还是允许交互的。然后由工程师创建对应的可视化算法及技术实现手段。包括建模方法、处理大规模数据的体系架构、交互技术、放大缩小方法等。动画工程师考虑表面材质、动画渲染方法等,交互设计师也会介入进行用户交互行为模式的设计。
所以一个数据可视化作品或项目的创建,需要多领域专业人士的协同工作才能取得成功。人类能够操纵和解释如此来源多样、错综复杂跨领域的信息,其本身就是一门艺术。
数据可视化在发展过程中,科学和工程领域的应用衍生出了分支:科学可视化——“利用计算机图形学来创建视觉图像,帮助人们理解科学技术概念或结果的那些错综复杂而又往往规模庞大的数字表现形式”。
在计算机诞生之前,科学的可视化行为就存在。如等高线图、磁力线图、天像图等等。利用计算机的强大运算能力,人类可以使用三维或四维的方式表现液体流型、分子动力学的复杂科学模型。
比如利用经验数据,科学可视化在天体物理学(模拟宇宙爆炸等)、地理学(模拟温室效应)、气象学(龙卷风或大气平流)模拟人类肉眼无法观察或记录的自然现象;利用医学数据(核磁共振或CT)研究和诊断人体;或者在建筑领域、城市规划领域或高端工业产品的研发过程中发挥重大重用。比如汽车的研发过程中,需要输入大量结构和材料数据,模拟汽车在受到撞击时如何变形。在城市道路规划的设计过程中,需要模拟交通流量。
虽然科学可视化的表现形式对于普通人比较陌生,像粒子系统、散点图、热力图等图表不接受专业训练很难看懂。但实际上科学可视化的成果已经渗透到我们生活的每个角落。
90年代初期,信息可视化领域进入人们的视野。用于解决对异质性数据中“抽象”的部分的分析。帮助人们理解和观察抽象概念,放大了人类的认知能力。
科学可视化和信息可视化的差别比较微妙,因为科学可视化的大部分处理对象都是抽象的概念。在手段和技术上也有大量共同之处。所以边界比较模糊。
在国外,许多大型企业、科研机构都会有相关部门进行数据可视化研究,如数字图书馆。媒体和政府机构也会对自己掌握的数据进行可视化分析,如犯罪地图。在互联网上,那些掌握了大量用户活动信息、用户关系网或语料库的网站,比如digg,friendfeed,flickr或大型电子商务网站等,都有实验性的可视化项目。可惜在中国在这方面的商用或实验项目还是比较空白的。
数据可视化的开发和大部分项目开发一样,也是根据需求来根据数据维度或属性进行筛选,根据目的和用户群选用表现方式。同一份数据可以可视化成多种看起来截然不同的形式。
- 有的可视化目标是为了观测、跟踪数据,所以就要强调实时性、变化、运算能力,可能就会生成一份不停变化、可读性强的图表。
- 有的为了分析数据,所以要强调数据的呈现度、可能会生成一份可以检索、交互式的图表
- 有的为了发现数据之间的潜在关联,可能会生成分布式的多维的图表。
- 有的为了帮助普通用户或商业用户快速理解数据的含义或变化,会利用漂亮的颜色、动画创建生动、明了,具有吸引力的图表。
- 还有的图表可以被用于教育、宣传或政治,被制作成海报、课件,出现在街头、广告手持、杂志和集会上。这类图表拥有强大的说服力,使用强烈的对比、置换等手段,可以创造出极具冲击力自指人心的图像。在国外许多媒体会根据新闻主题或数据,雇用设计师来创建可视化图表对新闻主题进行辅助。
说了那么多,大家都可以感受到数据可视化所应用价值,其多样性和表现力吸引了许多从业者,而其创作过程中的每一环节都有强大的专业背景支持。无论是动态还是静态的可视化图形,都为我们搭建了新的桥梁,让我们能洞察世界的究竟、发现形形色色的关系,感受每时每刻围绕在我们身边的信息变化,还能让我们理解其他形式下不易发掘的事物。
我通过翻译这系列的文章,为数据可视化的创造力所折服,也为其所能诞生和发展的背景环境所感叹。希望国内能有更多的跨领域人才的教育背景,能有发展实验性项目的环境,设计师们能拥有更多的创造力和专业素养,永远保持好奇心和敏感。
数据可视化相关的引擎/程序/工具(来自wiki百科)
- Instantatlas
- Data Desk
- DAVIX
- Eye-Sys
- Ferret Data Visualization and Analysis
- GGobi
- IBM OpenDX
- IDL (programming language)
- Style Intelligence
- OpenLink AJAX Toolkit
- ParaView
- Smile (software)
- StatSoft
- Visifire
- VisIt
- VTK
- Yoix
- Prefuse
信息可视化的相关方法
- Cladogram (phylogeny) 分支图
- Color alphabet 色彩字母表
- Dendrogram (classification) 树状图
- Information visualization reference model 信息可视化
- Graph drawing 图形绘制
- Halo (visualization technique) 晕轮法
- Heatmap 热力型地图
- HyperbolicTree 双曲树
- Multidimensional scaling 多维尺度分析
- Problem Solving Environment 问题求解环境
- Treemapping 矩形式树状图
(一)现代的数据可视化方法可视化
数据的表现形式可以是美丽、优雅和描述性的。有多种传统的数据表现形式 在每个项目及可能的场合被频繁地使用:如表格、饼图、柱状图等。但为了更有效地向你的读者传达信息,有时你需要绝不仅仅是一张饼图。有更好的、深刻的、富于创造性以及富有趣味的方法来可视化数据。它们中的许多将在未来数年内变得应用普遍。
我们期待的是什么?有哪些些革新性的想法已经在成熟使用?还有哪些创意地表现数据的方式是我们从未想过的?
让我们看看最有趣和最现代的数据可视化方法,以及一些相关文章、资源和工具。
1. Mindmaps 概念图Trendmap 2007 (趋势地图 2007)Informationarchitects.jp 依据分类、相似性、成功度、知名度和前景,为当年互联网上最成功的200个网站制作了一张趋势地图。这些网站以前显然从未以这种方式建立过联系。相当详尽。
译注:(这是一个著名的数据可视化创意,作者通过改造东京地铁地图,将站点设计成地铁站,每种网站应用类型是一条地铁线。比如粉红色代表分享类网站,紫红色代表工具类,大红色代表技术网站,柠檬黄色代表知识类网站……当然如果你对东京的城市地理状况有所了解,看这张地图时会露出更多会心的微笑。设计师在图中安排了大量暗喻和巧合,比如google从涩谷移到了新宿的位置,而Youtube已经控制了涩谷地区。涩谷在通常理解中,代表年轻人出没的喧嚷的地方。而新宿代表黑社 会控制,很酷的地方。微软移到了池袋,雅虎移到了上野,维基百科在新桥(一个遍布头脑清醒上班族的地方)。日本的网站主要集中在金融路线附近,北部的站点线(山口线)上的项目多数比较“无聊”。等等)2. Displaying News 新闻展示Newsmap(新闻地图)是google新闻聚合器上实时的新闻反馈的可视化呈现。数据块的大小对应了新闻受欢迎的程度。
译注:(Newsmap反映的是google新闻聚合器实时更新的新闻。这种数据可视图基于treemap树状图的算法,适合表现大量信息的聚合。用颜色、颜色深度、标题字号、区块面积来展现归并后的信息。打破空间限制,帮助用户快速识别、分类和认知新闻信息、平面而直观地展现不断变化的信息片段。)Voyage是一个rss阅读器。它在屏幕中心呈现最新更新的新闻。新闻可以缩放和退出,有一条基于时间轴的导航。
译注:(Voyage根据当前时间点形成一条坐标轴,使用了三维效果来分层次展现当前的资讯和新闻点,将信息的时间要素呈现地非常生动。可通过rss地址控制订制信息来源。)Digg BigSpy 将最受欢迎的文章放在顶部,字号越大代表支持者越多。
译注:(digglab使用5种动态的数据可视化方式来表现信息的数据变化状态。Digg BigSpy是试验项目其中之一,最新被digg的新闻会向下滚动更新屏幕,digg数越高,标题字体越大。在版面中使用字号变化是传统媒体的表现手段,在这里和实时滚动的效果结合,很有冲击力。)Digg Stack: 根据用户的digg数将文章排列成许多柱状条,digg数越高,柱型越高。
译注:(Digg Stack同 样也是digg lab的实验性项目之一,将最新/最热/全部的100条digg文章排列成一行柱状图,水平线上的柱形高度代表digg数,水平线下的柱形高度代表评论 数。某篇文章digg数实时增加时,会从屏幕上方掉一个小方块下来,俄罗斯方块那样,溶进该新闻对应的柱形中。点击单个柱体可以分别查看每个时间区间内的 digg指数。这是一个非常有实时感和动感的视觉系统,极好地呈现了数据生成的实时性和聚合性。)3. Displaying Data 数据展示Amaztype 图书搜索:根据从亚马逊上采集的数据,将图书的搜索结果根据你所提供的关键字的字母形状进行排列。可以点击单本书查看详细信息。
Flickrtime 也应用了相似的创意。这个工具利用Flickr API 将上传的图片根据当前时间排列成时钟数字的形状。
Time Magazine(时代周刊)使用峰值形状的分布来强调地图上美国人口的稠密程度。
CrazyEgg 使用热图来让您研究您的访客的新闻,通常被点击更多,更受欢迎的区域,使用的更“温暖”的红色来高亮显示。
译注:(CrazyEgg允许注册用户通过提交页面url,显示页面的热点图、获取每个元素的详情、查看原始数据的完整摘要信息。热图是用户行为分析的常见方法,这是一个著名的UE研究分析工具,给UE分析师提供观察用户行为,做出设计改进意见的数据基础。)
Hans Rosling TED Talk (汉斯。罗斯林的TED演讲)瑞典著名教授Hans Rosling发表了一次传统期的演讲,解释了他提出的表现统计数据的新方法。他的趋势分析软件(刚刚被google收购)将复杂的全球趋势、十几年的流行数据转化为生动的动画。用网格上的多彩的泡泡代表亚洲的各个国家,展现全民医疗和财富的状况。用动态的钟型曲线表现国民收入分配的涨伏。在 Rosling的手里,全球趋势——预期寿命、儿童死亡率、贫困率——都变得清晰、直观和有趣。
三视图展示了地球的3个视点: 每个国家使用一个圆形代表,用圆圈的大小来代表军费开支额度,颜色的深度来代表占财政收入的比例,数据的演示非常紧凑和美观。
We Feel Fine(我们感觉很好)根据来自大量blog的统计结果,表现了人类的感情。
译注:(这是一个骇人的项目。。从2005年8月,该项目组从大量页面上记录人类的感情。每个几分钟,系统就会搜索世界上新近发布的blog里包含“我觉得”或“我的感觉”这类短语的文章,记录包含这些短语的句子,并计算出里面c所包含的情绪,是悲伤、快乐、沮丧。这些信息和作者的社会结构、年龄、性别、地理位置以及当时当地的天气一起被保留下来。这个包含了数百万人感情的数据库,每天新增15000~2000条记录,并提供了一系列有趣的接口用于查询和做数据挖掘。上图中的粒子系统是通过接口生成的可视化形式之一,抽取了1500条数据,每条数据是一个粒子,代表每个人的一种情绪。颜色对应情绪类型,比如幸福是亮黄色,悲伤是深蓝色,愤怒是红色,平静的感情是浅绿色。每个粒子的大小和表达情绪的语句的长度关联。)Visualizing the Power Struggle in Wikipedia(维基百科上:可视化的争议)在热力地图上展示了最受欢迎的文章和被搜索最频繁的请求。
译注:(疑原文有误。heatmap:热力型地图,做用户体验分析的同学可能比较熟悉,是一种使用冷暖色来映射二维变量,以便于做出聚类分析的图像,擅长用于体现频率、密度等。译注:但是下面这两张信息图形使用的是气泡型地图。反映的是wiki百科中争议性词条的修订次数。圆圈越大,修订次数越多。排名前几位的是:耶稣、阿道夫希特勒、2003年10月、任天堂革命、卡特里娜飓风……)Websites as graphs 图表网站。一个HTML DOM的可视化应用程序,根据url、表格、div标签、图片、表单和其他标签,将网站可视化为信息图形。
译注:(这是一个分析页面源码的项目,使用树状分支图。其中蓝色代表,红色代表