1分钟做个dashboard

工作之余，写个简单的系列，前面几篇是1分钟做个funnel，1分钟做个时间序列，1分钟做个散点图。

图表工具：github搜cboard，或者点击链接,记得顺便star一下支持开源。

由于前几篇已经完成了几个图，组合就是一个dashboard，本文作为小结，稍微多写一些，因为同样是简单的线图、柱图、漏斗图，不同的组合，效果差异很大。

我们举2个例子

一、线＋漏斗

生活中dashboard最常见的图是饼图，比如驾驶面板，司机时刻需要关注油量和速度，饼图一目了然，然而互联网的dashboard，一般不追求那么实时（除非你是实时显示风投的钱还剩几块钱，我服），反而是更注重趋势，最常见的图是时间序列的线图。

ts

我们有很多场合会监控一个流程里从大到小的几个时间序列线，例如查询量，点击量，支付数量，订单量。当一个异常点需要看详情的时候，加上漏斗图，瞬间就有把线图往z轴转90度，形成截面观察的即视感，注意这是从2d变成3d，也就是跨维度的攻击了。

funnel

也许有人会说，柱图如果按顺序排列，也可以看出漏斗的效果，多重柱群也可以看时间趋势，这是没错的。

但是柱图由于同时完成了线图＋漏斗的两重作用，反而牺牲了线图的宏观角度，因为离散的柱子是很难看出斜率的，所以柱图通常还是要加线，脑补一下大家经常看到的柱子加上线的图，由于量纲单位经常不同，这时候往往又会用到第二坐标轴。

新手一般很喜欢用第二坐标轴，但是对于数据可视化来说，一个图，两套指标，是非常难以理解，而且容易造成视觉误差的，dashboard里应该尽量避免任何妨碍“一目了然”的事物。

第一点的线加漏斗，已经足够完成一个宏观、微观两相宜的面板，剩下的窍门可用设计原理概括：
1、相关
相关的内容必须紧贴在一起，也就是所谓亲密性，例如关键指标的线和漏斗不能因为美观而分开；
2、对比
相关的基础上，可对比的内容依次放在一起，例如前面的例子，查询－点击是连续步骤，支付－完成是连续步骤，要突出步骤对比，漏斗就是很好的方式，要突出比例对比，饼图是很好的方式；
3、重复
关键的内容群组，不要为了不重复而换不同的图形，例如不同步骤的转化线＋漏斗，可以反复出现，合理的重复是提高面板“一目了然”的重要一环，因为无需多次学习；
4、对齐
在相关、对比、重复的基础上，考虑人眼的从左到右，从上到下的路径，通过图表框架对齐来引导用户的视线。这种对齐可以是横向，也可以是圆形，有些玩的很花的面板，其实还是符合用户体验，就是把握准了用户视线不走冤枉路，看的舒服这个原则。

以上也就是CRAP的基本设计原则，不知道的话可以百度一下这个属于互联网基础知识的术语。

二、散点＋雷达图

第一点一般是给需求方做的图，那么做数据的时候我们自己用啥呢？个人而言，肯定是散点图。

plot

散点图的魅力在于“发现未知”，我们以鸡兔同笼来举例，我们假设这个规律太难，我无法理解鸡兔一共35个头是什么意思，那么我可以取点来映射，比如（1，34）（2，33），取了几个以后，散点图看一下，好巧，竟然隐约有某种规律。同理，鸡兔一共94条腿，那么取点映射（1，92/4）（2，90/4），散点图一下仍然可以看到规律。

中学数学的缺点在于，图形都恰好是一个‘好’的形状，我们姑且不讨论得到好形状的这种概率吧，将点一个个画出来仍然是最好的找规律的方法。在生活中的数据分析里，一般我们会有很多很多个列，形成多组散点图，通过聚类等进一步瞎找规律的做法，会将一部分点归类。

这时候如何直观地观察各种随便归类的效果呢？雷达图很适合。

如下图，用了现在最流行的国乒的雷达图。其实用王者荣耀的雷达图也可以。他们共同的特点是，每个方向的数字，互相之间并没有太大的关系，但是组合在一起，你会忽然发现，人眼可以识别出有些组合很“尖锐”，代表偏科，有些呢很“扁”，代表有某几个弱点，而面积大小可以粗略看成是所谓”整体实力“。

通过雷达图，将抽象之至的、正常人无法理解的多维向量，变成一个个可感知、可对比的数据可视化－－虽然到底对比了什么鬼我们自己也说不出，但就是觉得可以对比。

radar

在毫无头绪的数据探索过程中，往往需要散点＋分类＋雷达来”套“业务需求，有时候一套雷达启发出的业务关联性，是无数线图柱图永远做不到的，试试看，很有趣。

很晚了今天就写到这，谢谢阅读。本系列也先就这样了。