[译] 解密 Uber 数据部门的数据可视化最佳实践

概述

在2015年初,我们在Uber规划了一个官方的数据科学团队。这个主意的缘起是:通过可视化数据探索工具从Uber的数据中发现洞见。每天,Uber 管理上亿级别的GPS位置信息。每分钟,我们的平台处理上百万的移动事件。每次我们不用技术分析就直观地知道这是一个我们错过了解我们业务的好机会。

自成立以来,这个数据可视化团队就不断发展壮大,从我和另外一个工程师两个人发展到了现在的15人的全栈团队。数据可视化技术专家囊括了从计算机图形学到信息设计、封面创意技术以及 Web 平台开发。我们团队专注于从视觉分析到地图绘制以及从框架开发到面向公众的数据可视化的整个过程。

让我们看看都做了哪些工作:

可视化分析:增强数据可操作性

AB测试平台的表格和置信区间可视化

可视化分析主要都是由抽象数据可视化组成的。这个涉及到可视化工作的数据是没有内在的地理结构。与之相反的是科学可视化,这种可视化从物理世界(地图、3D物理结构等等)的角度描述了数据。大多数有效的可视化分析在这种情况下都是关于报告、仪表盘、实时分析的图标和网络图。我们的团队在大多数商业洞见应用和商业数据探索上加强了可视化图层。其他地区的同事用我们的可视化工具加强了包括我们的AB测试平台和内部的大规模机器学习平台的可视化效果。

我们团队强调建设像我们创建这个应用类似的可复用组件。我们最近开源了react-vis,这是一个 React 和加强版的D3 可视化库,它提供了 基于JSX的语法,专用的语言来组织图表的坐标、图标类型以及其他一些可视化元素。它支持开发人员以声明的方式在他们的数据集用 React- 和 JSX-友好型的形式来塑造他们想的可视化效果。

在地图绘制上我们也在做类似的工作。

地图绘制:大数据探索

基于地图的信息是我们在Uber最大最丰富的资产。然而,一方面,每天我们的平台实时采集上亿的GPS点。另一方面,我们必须在浏览器内实现数据密集可视化。这些都对实时地图可视化作出了极大挑战。

在给定半径区域内拖动鼠标将可以实时看到Uber的目的地分布情况

我们为不同顾客量身定制多种地图应用。其中一类顾客是在Uber运营的400多个城市内的总经理和城市运营团队。这个普通人需要有一个当前供求分布的及时信息。他们也需要获取聚合数据来理解城市的市场以便于进一步的策划市场营销活动。另一类用户是数据科学团队,他们需要丰富的数据探索界面来操作多维数据(通过产品、时间、地理数据来向下钻取)。我们为其他团队构建可以分块和切片的应用以便于从数据中获得洞见。

对于这些应用,我们的技术栈是由一些我们之前开发并且开源的库构成的。react-map-gl 提供一个在MapboxGL基础上与React类似的图层。这个MapboxGL是一个我们在Uber广泛使用的从Mapbox引入的库。deck.gl提供了一个创建WebGL增强图层的应用,它可以放在地图的最上层或者独自用来创建一个抽象的数据可视层。

deck.gl 和 react-map-gl 提供了 WebGL 界面来创建数据密集型的地图应用

但是所有这些技术都可以以一种创造性的方式被运用。数据可视化最重要的部分其实是数据故事叙述和数据艺术化呈现。

面向公众:讲述数据故事

用数据可视化讲述Uber的故事的方法有很多种。我们可以围绕诸如安全、效率、流量、政策等话题在大众传播网络中展开可视化叙述。

最近,我们开始了一个探索uberPool是如何让城市交通变得更高效的数据可视化项目。在 Travis Kalanick 的TED演讲之后,你将看到我们制作的数据可视化显示每个没有使用uberPOOL的街区流量情况,这表明了 POOL可以通过减少流量让城市变得更加智能化。

左图: SF 在没有uberPOOL时交通拥堵的城区。右图:POOL用一种聪明的办法均衡了交通流量。

我们继续做一起其他的可视化叙述。这个工作范畴有趣的融合了数据作家和数据艺术化呈现所带来的挑战。数据处理和我们我们内部可视化探索的数据分析产品一样充满挑战。但是这时候,以人为本的美学设计和通俗易懂的解释性是比高效的信息设计技术来得更重要的。

例如,我们开始和设计团队协作。为了动态地图可以显示每天每辆车的Uber行程,我们拿到了品牌视频。这里的特效就是用WebGL应用为每一帧动效都在服务端渲染进行渲染然后编译到视频里形成的。这个应用关注从数据获取(通过Hive)到视频离线渲染输出技术的每一个环节。

一个身临其境的 3D 动画地图匿名展示了一整天的Uber之旅:

三藩市:

洛杉矶:

对于这样的工作我们也开发了一套叫做luma.gl的框架,这套框架专注于基于WebGL的可视化应用。它根据一些诸如ES6、WebGL 2.0、组件化平台的现代技术而设计。这使得luma.gl可以和其他诸如stack.gl那样的流行的库一起互操作。

想知道更多吗?

在Uber,数据使我们最大的财富。我们用可视化探索数据分析工具通过数据来发现洞见,而且我们业务矩阵的数据探索也能够让我们Uber所有城市的管理者做出更加有效的商业决策。
如果你对和我们的Uber工程团队一起面对这些挑战感兴趣,你可以查看我们的数据可视化工程的开放职位列表,然后联系data-viz@uber.com。我们期待你的加入。

原作者: NICOLAS GARCIA BELMONTE 译者:Harryzhu
英文原文地址:https://eng.uber.com/data-viz...

作为分享主义者(sharism),本人所有互联网发布的图文均遵从CC版权,转载请保留作者信息并注明作者 Harry Zhu 的 FinanceR专栏:https://segmentfault.com/blog...,如果涉及源代码请注明GitHub地址:https://github.com/harryprince。微信号: harryzhustudio
商业使用请联系作者。


FinanceR
循环写作,持续更新,形成闭环,贵在坚持
2.2k 声望
2.2k 粉丝
0 条评论
推荐阅读
[译] 层次时间序列预测法
大多数关于时间序列预测的文章都侧重于特定的聚合程度。但是,当我们能够深入分析聚合的数据,以便在更细粒度的层次上观察同一个序列时,挑战就出现了。在这种情况下,我们往往会发现,对较低水平的预测与总体预...

HarryZhu阅读 2.9k

封面图
正则表达式实例
收集在业务中经常使用的正则表达式实例,方便以后进行查找,减少工作量。常用正则表达式实例1. 校验基本日期格式 {代码...} {代码...} 2. 校验密码强度密码的强度必须是包含大小写字母和数字的组合,不能使用特殊...

寒青56阅读 8.4k评论 11

JavaScript有用的代码片段和trick
平时工作过程中可以用到的实用代码集棉。判断对象否为空 {代码...} 浮点数取整 {代码...} 注意:前三种方法只适用于32个位整数,对于负数的处理上和Math.floor是不同的。 {代码...} 生成6位数字验证码 {代码...} ...

jenemy48阅读 6.8k评论 12

从零搭建 Node.js 企业级 Web 服务器(十五):总结与展望
总结截止到本章 “从零搭建 Node.js 企业级 Web 服务器” 主题共计 16 章内容就更新完毕了,回顾第零章曾写道:搭建一个 Node.js 企业级 Web 服务器并非难事,只是必须做好几个关键事项这几件必须做好的关键事项就...

乌柏木75阅读 7k评论 16

再也不学AJAX了!(二)使用AJAX ① XMLHttpRequest
「再也不学 AJAX 了」是一个以 AJAX 为主题的系列文章,希望读者通过阅读本系列文章,能够对 AJAX 技术有更加深入的认识和理解,从此能够再也不用专门学习 AJAX。本篇文章为该系列的第二篇,最近更新于 2023 年 1...

libinfs42阅读 6.8k评论 12

封面图
从零搭建 Node.js 企业级 Web 服务器(一):接口与分层
分层规范从本章起,正式进入企业级 Web 服务器核心内容。通常,一块完整的业务逻辑是由视图层、控制层、服务层、模型层共同定义与实现的,如下图:从上至下,抽象层次逐渐加深。从下至上,业务细节逐渐清晰。视图...

乌柏木45阅读 8.4k评论 6

从零搭建 Node.js 企业级 Web 服务器(二):校验
校验就是对输入条件的约束,避免无效的输入引起异常。Web 系统的用户输入主要为编辑与提交各类表单,一方面校验要做在编辑表单字段与提交的时候,另一方面接收表单的接口也要做足校验行为,通过前后端共同控制输...

乌柏木35阅读 6.6k评论 10

2.2k 声望
2.2k 粉丝
宣传栏