Vega数据可视化工具—教你轻松玩转大数据可视化 | 附代码

摘要： Vega是一种大数据可视化的高效工具，本文以分析游隼的迁徙情况为例，展示了Vega工具的强大能力及易学易用特点。

目前我们处于信息时代，万物联网的时代已经到来。从我们的日常生活中可以发现，小到身边的智能家居，再到平时出行的共享单车、滴滴等打车软件等，无时无刻不在产生大量的数据。这几年的时间里产生的数据量，已经远远超过了历史上其它时间的总和。那么这么多的数据汇聚成一个大数据，如何对这些数据进行有效分析与加以利用就变得十分重要了，而大数据可视化是进行大数据分析的一把利器。

什么是大数据可视化呢，参考一些资料给出的定义如下，现代的数据可视化（Data Visualization）技术指的是运用计算机图形学和图像处理技术，将数据换为图形或图像在屏幕上显示出来，并进行交互处理的理论、方法和技术。简单来说就是将看似毫无意义的数据、信息、知识等等以一种容易理解的视觉方式展示出来的技术，从而对数据进行更深入的观察和分析。本文将介绍一种可视化的语法Vega，非常简单易学易用，希望能帮助大家在数据可视化及分析上提供一些思路。

Vega是一种可视化语法，用于创建、保存和共享交互式可视化设计的声明式语言。使用Vega，我们能够以JSON格式描述可视化的视觉外观和交互行为，并使用Canvas或SVG生成基于Web的视图。另外Vega为各种可视化设计提供基本构建块：数据加载、转换、缩放、地图投影、轴、图例和图形标记（如矩形，线条，绘图符号等）。Vega为可视化的计算生成提供了非常快捷的表示，可以作为新的API和视觉分析工具的基础。本文下面将主要介绍MapD Vega。

MapD Vega是基于Jeffrey Heer及其在华盛顿大学的团队开发的开源Vega规范。我们已经将原始规范适用于MapD平台，因此可以使用SQL研究数据，并能快速实施自定义可视化。MapD使用Vega直接在SQL查询的结果集上驱动渲染引擎，而不需要数据离开GPU，使得用户能够以纯粹的前端可视化工具以不可能的方式可视化细粒度数据。下图是Vega渲染的欧洲推文图像，根据语言进行颜色编码，这可以在Vega文档示例中找到：

作为开发人员或数据分析师，可以借助可视化工具轻松了解收集的数据，并且不会因为几何可视化细节的复杂性而受到任何损失。Vega比大多数可视化工具更加高级，并且可以轻松支持自定义算法和高级可视化技术。下面将以一个简单的例子来说明使用Vega是多么的简单易学，读者也可以将其用作探索自己的数据的跳板。

Vega规范采用JSON结构，因此易于以编程方式创建、理解和操作。甚至还可以创建一些常见的图表类型。Vega规范包括：

• 数据源选择，可以是SQL语句或行内数据。

• 在图或表上可以表示数据的选项：

• 点

• 几何形状符号

• 多边形

• 缩放渲染数据和量化数据属性的选项：

• 定量 - 线性、对数、指数、平方根和量化尺度

• 离散 - 顺序和阈值尺度

MapD 连接器API可以轻松地将Vega JSON发送到后台，从而呈现可视化，并将base64编码的PNG图像返回给客户端。我们可以使用API 或Apache Thrift直接在几个步骤中进行呈现请求：

• 1. 创建Vega规范

• 2. 使用Thrift或renderVega()API函数进行呈现请求，API取决于node-connector.js或browser-connector.js

• 3. 异步地接收渲染的图像并将其显示在应用程序中。

Vega文档包括教程、参考指南以及在客户端浏览器中使用Vega的示例源代码，因此建议你使用Vega探索你的数据。

“地球上最快的动物”遇到了地球上最快的大数据探索平台

MapD平台是最快的大数据探索平台，而游隼是潜水中已被记录的全球最快的动物，时速为242英里。使用Vega能更好地了解你的数据，比使用其他大多数可视化工具更快且更加直观。我们来仔细看看游隼是怎么回事。

在我们简单的调查中，来看看沿太平洋迁徙路线的鸟类迁徙。具体来说，在旧金山湾地区，鸟类在南太平洋和旧金山湾之间汇集在一起 。除了业余鸟类爱好者的报道外，鸟类还被位于马林县霍克山的金门猛禽天文台以及雷耶斯和法拉隆群岛的点蓝组织统计。我们的数据来自于ebird机构，是与康奈尔鸟类实验室协调统一报告和收集的结果。

如果我们使用你已经熟悉的MapD Immerse SQL编辑器，将会获得一个可视化的列表图表，显示的是2015年特定月份的游隼踪迹的纬度和经度坐标：

从列表中可以很容易地了解游隼的数量。如果想看看每个月的猎鹰隼的数量是如何变化的，并且可能还需对任何变化的原因进行一些评估，那么Vega这个更强大的可视化工具可以帮助你。每个增加的数据中的可见性程度通常表明我们可能要考虑到可视化的其他数据字段，并且对于Vage而言，添加更多的数据和字段到分析中是非常容易的。在这个例子中，我们可能想知道游隼在某些月份天气中的迁徙特征。我们来看看一个Vega可视化，下图显示把纬度和经度作为x和y轴坐标，将观察到的次数叠加在海湾区域的地图上：

每个绘图点是一个Vega 标记规范，其中按照观察次数进行月份的着色。

我们可以看到，最大数量的游隼出现在十月份，可以预料到，在霍克山、金门大桥北面和法拉隆群岛也都能观察到游隼。雷耶斯的西北地区在六月份出现大量的游隼，这真是意想不到的，这也表明需要更多的数据或不同的可视化来更好地了解游隼迁徙的影响。同时我们也可以看到这些景象集中在沿海地区，大概是因为海鸟是游隼最喜欢的饮食。

我们来看看如何从ebird数据库中的数百万条记录的鸟类目录中创建这么以下这个可视化。

Vega规范包括：

• 数据属性指定和过滤数据源的属性。

• 标记属性定义数据项的基本可视化图形的属性。

• 尺度属性定义几何的属性或向数据项可视化应用的附加属性。

• 观看区域维度。

数据属性

"data": [
    {        "name": "ptable",
        "sql": "SELECT decimalLongitude as x, decimalLatitude as y, c10_month as m, individualCount as c, ebird.rowid FROM ebird WHERE (county = 'San Francisco' OR county = 'Marin') AND c9_year = 2015 AND scientificName = 'Falco peregrinus' AND individualCount IS NOT NULL LIMIT 2000000"
    }]

 

Vega支持SQL语句，所以可以从ebird数据集中提取出纬度、经度、月份及观察次数。此外，将数据限于2015年两个海湾区县。

通过ptable为数据集分配名称，其他规范属性可以引用数据源得到。

标记属性

marks: [
    {        "type": "points",
        "from": {            "data": "ptable"
        },
        "properties": {            "x": {                "scale": "x",
                "field": "x"
            },
            "y": {                "scale": "y",
                "field": "y"
            },
            "fillColor": {                "scale": "color",
                "field": "m"
            },
            "size": {                "scale": "count",
                "field": "c"
            }
        }
    }]

使用ptable数据，标记属性将纬度和经度定义为图中x坐标和y坐标。每个渲染的数据点的大小根据一个计数刻度，其大小对应于观察到的游隼数量，并使用比色刻度尺对相关的观察月份进行着色。

尺度属性

"scales": [
    {
        "name": "x",
        "type": "linear",
        "domain": [-123.03,-122.35],
        "range": "width"
    },
    {
        "name": "y",
        "type": "linear",
        "domain": [37.4833,38.3094],
        "range": "height"
    },
    {
        "name": "count",
        "type": "quantize",
        "domain": [1,10],
        "range": [3,6,9,12,15,18,21,24,27,30]
    },
    {
        "name": "color",
        "type": "ordinal",
        "domain": [1,2,3,4,5,6,7,8,9,10,11,12],
        "range": ["#f49242", "#f4c842", "#e8f441",
                  "#acf441", "#64f441", "#41f4bb",
                  "#42b3f4", "#4170f4", "#8241f4",
                  "#cd41f4", "#f441b8", "#f44161"],
      "default": "#6c809b",
      "nullValue": "#cacaca"
    }]

该尺度属性将输入数据映射域到输出可视化范围。Vega支持定量和离散缩放以匹配固有的数据连续性。其中，纬度和经度定义为x和y坐标轴，并且将两个县的边界映射到可视化区域。

计数尺度定义了渲染的点尺寸，将范围量化为10个值。这覆盖了观察次数的范围，当我们使用SQL编辑器查询数据时，显示10是观察游隼数最大的值。

在颜色比例给每个月份分配不相关联的颜色时，如果记录数据未指定月份，则将游隼的中间颜色分配为默认值。空数据条目以浅灰色表示，尽管SQL语句已经删除了所有的空数据条目。

可视化区域属性

最后，使用以下观看区域尺寸，这个尺寸很方便地匹配了数据的十进制GPS坐标：

"width": 480
"height": 720

以下是此示例中使用的完整JSON结构：

 

const exampleVegaSpec = {
    "width": 480,
    "height": 720,
    "data": [
        {
            "name": "ptable",
            "sql": "SELECT decimalLongitude as x, decimalLatitude as y, c10_month as m, individualCount as c, ebird.rowid FROM ebird WHERE (county = 'San Francisco' OR county = 'Marin') AND c9_year = 2015 AND scientificName = 'Falco peregrinus' AND individualCount IS NOT NULL LIMIT 2000000"
        }
    ],
    "scales": [
        {
            "name": "x",
            "type": "linear",
            "domain": [-123.03,-122.35],
            "range": "width"
        },
        {
            "name": "y",
            "type": "linear",
            "domain": [37.4833,38.3094],
            "range": "height"
        },
        {
            "name": "count",
            "type": "quantize",
            "domain": [1,10],
            "range": [3,6,9,12,15,18,21,24,27,30]
        },
        {
            "name": "color",
            "type": "ordinal",
            "domain": [1,2,3,4,5,6,7,8,9,10,11,12],
            "range": ["#f49242", "#f4c842", "#e8f441",
                      "#acf441", "#64f441", "#41f4bb",
                      "#42b3f4", "#4170f4", "#8241f4",
                      "#cd41f4", "#f441b8", "#f44161"],
            "default": "#6c809b",
            "nullValue": "#cacaca"
        }
    ],
    marks: [
        {
            "type": "points",
            "from": {"data": "ptable"},
            "properties": {
                "x": {
                    "scale": "x",
                    "field": "x"
                },
                "y": {
                    "scale": "y",
                    "field": "y"
                },
                "fillColor": {
                    "scale": "color",
                    "field": "m"
                },
                "size": {
                    "scale": "count",
                    "field": "c"
                }
            }
        }
    ]};

VEGA可以轻松快速发现数据之间的关系和依赖关系，每个可视化可以让你更深入地了解数据，并驱使你想从中提取更多的有用信息。花费几分钟时间使用我们的示例数据，并对数据属性SQL语句进行一个小的更改，就可以得到一个完全不同的游隼视图。下面来看看10年间隔内每个月观察游隼的相关情况：

SELECT c10_month as mo, c9_year as yr, county as cty, SUM(individualCount) as c FROM ebird WHERE scientificName = 'Falco peregrinus'  AND (county = 'San Francisco') GROUP BY cty,c9_year,c10_month HAVING (SUM(individualCount) > 0) AND (c9_year >= 2006 AND c9_year <= 2015) LIMIT 2000000"

在这里我们使用月份和年份代替纬度和经度来扩展我们的数据点，使用规范county= ‘San Francisco’及county = ‘Marin’渲染两个图表，下图将其结合并对其注释：

在这十年的时间里，我们可以发现游隼的数量是有所增加。但是，在过去的两年里，游隼们似乎全年在马林县徘徊，这也可能部分地解释了在六月份看到的意外数量的观察数。

作者信息

Maped网站：该网站是由科学家、工程师和数据分析师创立，网站的使命是使数据探索成为身临其境的体验。

Site：https://www.mapd.com/

本文由北邮@爱可可-爱生活老师推荐，阿里云云栖社区组织翻译。

文章原标题《Vega makes visualizing BIG data easy》，作者：Gene，译者：海棠

更为详细的内容，请查看原文：

http://click.aliyun.com/m/27111/