d3.doc

D3
数据可视化,第 1 部分: 使用 SVG 和 D3 可视化浏览指标
分析社交媒体指标
社交媒体大数据挑战
社交媒体站点(比如 Twitter、Facebook 和 YouTube)提供了全面的 Web 服务接口来公开它们的功能。例如,YouTube Data API 支持应用程序将视频上传到 YouTube,或播放一个网站上现有的 YouTube 视频。现在这些站点也在开发分析 API。举例而言,YouTube Analytics API 向编程客户端提供了查看次数和喜欢次数(number of likes)等统计数据。结果,更多的业务应用程序可通过可视和编程接口与社交媒体互动。对所有规模的公司而言,下一个挑战是通过大数据分析将大量社交数据最有效地应用到业务中。数据可视化(整个分析场景中的一个组成部分)是这个文章系列的关注重点。您可了解 IBM 大数据平台的 IBM InfoSphere Streams和 IBM InfoSphere BigInsights产品全面的分析功能。
公司理解客户行为的一种创造性方式是,通过社交媒体提出想法,并让潜在客户参与到交互式讨论中。社交媒体上的互动反映了双向的人际互动:要理解人们的好恶,您必须聆听他们在说什么,就像您希望与积极主动的人互动一样。
以一家家庭装饰公司为假设场景,该公司以博客、视频、Facebook 页面和论坛形式发布公开内容。这些内容通过社交媒体资源展示了公司的想法,并尝试发起讨论和其他形式的用户互动。这些内容迎合各个客户的口味和偏好,帮助他们从一个社交资源导航到另一个。为了判断不断变化的客户趋势并提出新方法和新设计,公司希望从三个方面分析浏览数据:
流行度,由每个社交资源的查看次数表示
参与该资源上的互动的用户数量
用户从一个资源导航到另一个资源的方向
表 1、2和 3 分别显示了三周内用户查看、用户互动和导航次数。请注意,这些表使用了彩色名称来表示公司使用的社交媒体资源类型(比如博客和 Facebook 页面)。
表 1 显示了每个资源的用户查看次数:
从表 3可以看到,在第 1 周有 3,057 名用户在访问蓝色资源后导航到了金色资源,而且红色资源收到了来自蓝色资源的最多观众。
浏览数据的可视化
可视内容提供了一种比数字表格更容易、更快捷的方式来解释大数据量。可通过多种方式以图形方式表示表 1、2和 3中的数据。例如,图 1 就是一种显示表 1中的第 1 周数据的简单方式:
图 1. 用圆圈表示的每种社交资源在第 1 周的查看次数
图 1 将每种资源的查看次数表示为一个圆圈。圆圈的相对大小与它们表示的次数成正比,所以查看最多的资源(金色)由最大的圆圈表示。每个圆圈还显示了每种资源第 1 周获得的实际查看次数。
图 2 是图 1的一种细微变形,使用了一种不同的圆圈布局:
图 2. 以稍微不同的圆圈布局显示的第 1 周查看次数
每种资源的流行度只是公司希望分析的一个数据维度。图 3 同时显示了第 1 周每种资源的查看次数和希望在该资源上互动的用户数量—一种可视化表示中包含两种维度:
图 3. 嵌套的圆圈表示了第 1 周的用户查看次数和互动的用户数量
在图 3 中,外圈表示资源的总查看次数,内圈表示在该资源上互动的用户数量。我还在每个圆圈中放入了数字来表示实际的查看和互动数据。
图 1、图 2和图 3 显示了组合颜色、形状和实际数字来表示数据的简单方式。通过查看图 3,您可看到金色资源在第 1 周吸引了最多用户查看,而紫红色资源上的互动最多。
使用开放技术实现数据可视化
动态生成的可视化 JavaScript
D3、DVG 和 JavaScript 相结合,形成了一个基于浏览器的完整的数据可视化套件。为了在此文章系列中演示它们的结合使用,我在示例代码中应编码了示例数据。通过服务器端组件动态组合了真实项目中的大部分 JavaScript 代码。在大数据分析应用程序中,这些组件可能包括基于 Apache Hadoop 的集群,托管各种各样服务器端模块的 Web 和应用服务器,以及数据库服务器。使用 D3 以及来自这类来源的 JavaScript 生成 SVG 代码,这种做法非常适合支持 JavaScript 的现代业务应用程序,比如 IBM Business Process Manager。
目前的开放标准和开源工具已足够强大,能够支持数据的图形表示。SVG 是一个开放的万维网联盟(W3C) 标准,它定义了一种基于 XML 的格式来绘制二维图形对象。SVG 受多种浏览器支持。我在 Google Chrome 上测试了本文的所有 SVG 和 JavaScript 代码。
如果您在处理数据和 SVG,D3 库提供了一些不错功能