本文首先举了一些数据可视化的例子，希望通过通过分析这些实现来一窥作者设计的意图，接着，提出了量子系统应用的目标，并探讨了我们在选型时考虑的过程和因素，最后举了一个量子中应用的例子，希望能给读者在选型时带来一些参考。

在这个数据爆炸的年代，从海量数据中分析出有意义的数据和为这些数据选择合适的表现形式同样重要。

在我们的身边，数据可视化的实例时时上演――交通流量图、天气预报、思维导图、历史事件和新闻等等。由于数据可视化目标的不同，设计师们选择了各种各样的形式来展现数据。为了观测、跟踪数据，需要强调实时性、变化和运算，可能会选择动态变化的图表；为了强调大量数据的呈现，可能会选择一份有索引以及交互检索的图表；为了强调数据间的潜在联系，可能会生成分布式的多维图表；为了让普通用户能够迅速理解数据的含义、指标的变化等，可能会利用漂亮的图形和颜色，来生成生动的报表。

例如，google地图的路况信息，通过不同颜色的线条，让人一目了然当前的路况，这种可视化实例不关心具体的数据变化、不关心数据的计算，只能知道大致的拥堵分布情况，适合在使用时看一眼。

在Where are the jobs?
http://www.washingtonpost.com/wp-srv/special/business/unemployment-where-are-the-jobs/
这个网站根据美国劳工统计局的数据，展现了经济衰退和经济危机中就业机会的变化趋势。同时，提供了交互操作，让读者可以切换不同职业的变化曲线，同时点击趋势曲线还会继续展开按行业细分的变化曲线。在每条曲线上，作者还以插入说明的方式，简单地分析了曲线产生波动的原因。因此，通过分析这个图表，读者就可以清晰地把握职业需求量的变化趋势以及影响因素，这比阅读美国劳工统计局提供的分析报告要轻松得多。

提到交互，我们可以简单的将数据可视化的实例分为可以交互与不可以交互两大类。例如，就业机会趋势图表就是一个可以交互例子，作者并没有将信息摆在点开网页后的第一页，而是需要读者通过探索来得到自己需要的信息。

在A History of Modern Music: the timeline
http://www.guardian.co.uk/music/interactive/2011/jun/11/history-modern-music-timeline
中，作者将交互变得更有趣味性，这是一个现代音乐发展史的新闻列表，从1899年出发，在每种音乐发展的道路上出现的标记都是一个历史事件，通过拉下方的滑块，或者右侧的按钮，读者将看到随着时间向前推进，历史潮流不可逆转一般，从一枝独秀到百家争鸣。当然，如果想仔细地看一种音乐的历史潮流和历史事件也是支持的。

这种活泼灵活的方式，使得浏览者能在这个页面上停留很长时间。

而相对的，不可以交互的数据可视化项目则可以让读者去细细阅读作者提供的信息和数据，同时，这些信息能够在一屏之内展示，满足的是用户直观和快速获取信息的需求。

来源分析中的应用

在所有的流量统计软件中，来源分析都是非常重要且必备的一块。
从数据可视化的角度来看，目前比较主流的展示方式为报表+图表。
例如，

这个例子利用饼图展现来源类型的比例，通过折线图辅助展现时间维度的指标信息。详细数据和其他指标列在下方的数据报表中。

在量子系统的应用中，最初我们挑选了几个适合可视化改造的模块（详见数据可视化-量子前端技术驱动项目介绍）。首先，我们选择流量来源构成报表来进行分析，我们的目标是通过来源分析报表，用户可以得知自己投放广告的推广效果、合作网站带来的流量，进一步为将来的运营推广工作提供指导。如果更深入地分析，用户还可以从流量来源分析中了解到目标客户的浏览路径和行为特征，牢牢把握住用户。

这个报表目前采用的是纯数据表格的形式。我们采取了如下步骤来为这个报表选取数据可视化的形式：

1. 分析用户的需求
   a)         用户都是淘宝上的卖家，他们每天都会看这个报表，关注自己每个推广为自己带来多少流量；
   b)         他们通常都会下载整个表格，再进行数据分析。
2. 通过对这两个基本需求的分析，我们可以得到如下的信息：
   a)         这个报表页面展现量很高，对数据展示和性能有要求，不适合非常沉重的展现形式；
   b)         用户具有相当的数据分析能力，纯数据的表格需要为他们保留；
   c)         淘宝卖家都是很忙碌的，不应该增加他们的学习成本，或者改变现在的使用习惯。
3. 基于上述分析结果，我们基本明确了报表+可视化图形的展示方式
4. 头脑风暴

a)         特色选型

1. 类似新浪微博的微关系，着重于关系的概念，通过节点的大小和连线粗细来展示到达页面的来源。
   
2. 类似热点定位图，模拟一张虚拟的地图，当有一个访问从某个来源发起的时候，实时地从虚拟地图上产生一个信号。这个形式对后端服务器会有较大的压力。
   

b)         直观选型

1. 流量 -> 水流 -> 提出流量流入店铺再流出的概念，目标是展现一种流动的状态。（如下图，可以认为上半部分是输入，下半部分是输出）
   

c)         采用传统图表的选型

1. 采用面积图结合时间轴的形式，展现一种随着时间流逝，各个流量所占比例变化趋势和比例的复杂图表。也有实时要求，对后端服务器有压力。
   
5. 最后，从实际实现、与产品结合的密切程度上考虑，我们认为通过微关系图和流水图来展现更有优势。

目前的进展

我想读者现在应该很想知道，我们最终实现了什么。在量子新推出来源分析产品中，经过产品经理和开发工程师的努力，在其中的宝贝页来源分析页面实现了一个数据可视化的实例。如下图

这个图表中通过圆的大小和线条的粗细直观地反映了流量所占比例，将大圆分成两个部分，展现了流入和流出的概念。同时，宝贝页来源分析功能也提供了详细指标报表和下钻，为用户进行针对性地数据分析提供了基础数据。更多的体验可以访问http://lz.taobao.com

下面是结尾

这是量子系统在数据可视化方面做出的一个尝试，今后，我们还会努力产出更多效果和内容都丰富多彩的产品，感谢亲的关注。

建议继续学习：

1. 好软件推荐 gnuplot 来做可视化数据    (阅读：2674)
2. 给数据穿上美丽的外衣    (阅读：2582)
3. 惊现！表面下的隐藏信息――浅谈信息可视化    (阅读：2408)
4. 浅谈信息可视化――航空篇    (阅读：2149)
5. 白话Block Formatting Context    (阅读：1880)
6. 数据可视化初体验(R语言)    (阅读：1780)
7. 信息可视化研究范畴及案例    (阅读：1651)
8. 轻触，数据美丽的外衣    (阅读：1626)
9. iOS可视化编程 Tips 之“无需代码设置圆角”    (阅读：1803)
10. 一种基于flex的可视化多层流量切分界面的实现    (阅读：1415)