数据可视化本身有多种形式,每种显示类型都适合不同的数据和演示需求。我们不会在这里详细介绍每种数据呈现方式,但有一些典型且突出的选项值得注意。
条形图、饼图、折线图和面积图等典型图表和图形始终是数据可视化的良好选择。这些是该方法的主要内容:
维基百科统计仪表板显示过去两年的总页面浏览量。顶部的搜索栏可让用户探索主题或浏览问题。主内容显示条形图,其中绿色条表示每月页面浏览量数据。侧边栏选项包括各种指标和过滤器。显示的总浏览量为 2650 亿次。
维基百科网站显示了其总页面浏览量的条形图。
散点图稍微复杂一些,但可以展示两个变量之间的关系:
散点图显示了 2021 年 5 月、6 月和 7 月的票房报告数据。x 轴范围从 0 到 12,y 轴范围从 0 到 20。彩色点代表每个月的数据点,三个月总体呈上升趋势。
英国电影协会 (BFI) 的票房指标散点图。
地图有多种形式。热图有小众用途,但会使用颜色渐变来显示数据集的强度。交互式世界地图非常适合需要基于位置的交互性的情况:
一张世界地图,上面显示带有数字的黄色标记,标明不同国家和大洲的 WordCamp 的位置。地图显示标记集中在北美、欧洲和亚洲部分地区。
WordCamp 主网站在一个交互式嵌入式地图上标记了全球所有活动。
计数器和进度条更适合里程碑式的成就。在这里,您将使用数字计数器,使用动态计数来计算最终值。圆形进度条可以帮助显示完成百分比。您也可以使用线性水平或垂直条来实现这一点:
WordPress 的 GitHub 存储库页面显示了社区标准部分。清单表明该项目已完成描述、自述文件、行为准则和许可证等项目,但仍有一些项目尚待完成,例如贡献指南和安全政策。
WordPress GitHub 官方页面上的社区标准洞察显示了与下方任务列表相关的公共进度条。
甚至图片库、灯箱和滑块也可以帮助您在多张幻灯片中、通过叠加或几乎以故事驱动的事件的形式呈现数据。这是时间线可视化可以发挥作用的地方,流程流也可以。您会在摄影教程网站上经常看到的一种数据可视化类型是“前后对比”。
垂直方向呈现了两个对比鲜明的城市场景。上方图像 丹麦 WhatsApp 手机号码列表 显示的是白天街道上的景象,街道上人头攒动,建筑物林立,电线和灯泡悬挂不计其数。下方图像显示的是夜晚光线昏暗、潮湿的小巷,远处可见霓虹灯和自动售货机。
使用动态且交互式的前后滑块可以帮助您展示两张相似的图像之间的差异。
这可让您使用动态滑块比较图像的两个版本,该滑块可在图像上拖动,从而显示另一个版本。对于您的用例来说,它可能不会有太大作用,但请记住 - 每种可视化类型都有理想的应用。
在哪里使用图形小部件(包括示例)
您使用的可视化类型很重要,但如何使用它(以及在哪里使用)也很重要。也就是说,在不同的应用程序中,使用图形小部件将带来很大的好处。
您会发现,除了典型用例之外,还有一些您经常看到但与数据可视化无关的应用程序。在接下来的几节中,我们将介绍其中的一些用途。
商业应用程序
图形小部件的“首选”实现方式之一是展示您的关键指标。对于企业来说,这在以吸引人的方式呈现数据方面显然是一大优势。条形图具有正确的轴值,易于阅读,有助于直观地显示一段时间内的销售趋势或比较不同的产品或服务。
Target是数百万家采用这种方式来展示年收入增长的公司之一:
Target 的财务绩效信息图显示了 2018 年至 2023 年的总收入、营业收入、净收益和稀释每股收益。条形图显示所有指标的同比增长,其中 2023 年以红色突出显示。每个类别都提供了绩效百分比和五年复合年增长率。
Target 使用条形图来比较多个数据点的同比表现。
这也展示了这些简单的演示如何说明不同指标之间的关系,例如客户获取成本或终身价值。堆积条形图也可以显示这种类型的比较。WordPress 在插件目录中使用此方法来显示用户安装的插件版本的细目:
WordPress 插件的高级屏幕,显示活跃版本、每日下载量图表和插件详细信息。这些详细信息包括版本号、活跃安装和评级。该插件拥有超过 400 万个活跃安装和 4.5 星评级。
WordPress 插件目录使用堆积条形图来显示用户下载了哪些版本。
如果企业想要展示有关其客户群的数据,饼图和环形图是很好的选择。通常,这些数据将按年龄、位置或其他相关因素进行细分。Elementor使用酷炫而独特的粒子可视化来突出显示其最大的用户群:
Elementor 网站展示了其社区中用户最多的国家/地区的粒子可视化。三个彩色圆圈代表美国(最大)、德国(中)和英国(最小)。装饰性的星座线连接着圆圈。
粒子效果也可用于数据可视化。Elementor 使用它来显示与其用户群相关的信息。
在其他情况下,您可以选择展示公司里程碑或项目进展。Flourish使用时间线来展示其历史,这可能会对品牌忠诚度产生影响:
时间线展示了数据可视化工具 Flourish 的演变。关键里程碑包括 2016 年的初始构想、2017 年的开发人员 SDK 以及 2018 年 Flourish 编辑器的发布。时间线还展示了 2016 年数据叙事方面的困难以及 2018 年向记者的推广。
Flourish 网站使用有吸引力的时间线显示来展示其历史。
事实上,电子商务与一般商业应用并行运行,因此这里的一切也适用于商店。即便如此,这个行业也有特定的数据可视化方法。
电子商务指标
购买决策通常需要几秒钟的深思熟虑,因此快速向客户提供正确的信息至关重要。使用条形图或雷达图进行产品比较可以帮助您比较不同产品的功能或规格,但这仅仅是开始。
例如,SRFACE使用交互式样式指南来解释其潜水服的规格并直观地展示每种款式的外观:
女士黑色潜水服产品页面的 GIF。其中显示了潜水服的图片、定价信息、尺寸和厚度选项以及产品详细信息(例如运输和保修信息)。在整个过程中,用户都会浏览屏幕上显示的尺寸、款式和产品信息。
交互式风格指南可以为电子商务商店带来巨大好处,因为它们可以为潜在客户提供更加身临其境的体验。
它类似于商业应用程序,但您也可以使用图表和图形来帮助访问者了解产品采用的趋势。WordPress主题目录使用条形图来实现这一点:
柱状图显示了一段时间内 WordPress 主题的每日下载量。图表显示活跃安装量超过一百万。下载量波动较大,几次高峰达到每天约 12,000 次下载,中间穿插着每日下载量约 6,000-8,000 次的低活动期。X 轴跨越 2023 年 11 月至 2024 年 7 月。
WordPress 主题目录包含一个条形图,显示每个主题随时间变化的下载数据。
您可以将图形小部件放在任何原本要使用文本的地方。例如,许多电子商务商店使用简单的对比文本进行库存计算。但是,进度条可能更适合这里,因为它也可以增加销售的紧迫性。
实时指标跟踪
实时可视化具有令人兴奋的感觉,因为您可以看到 跟踪指标的实时进展。 慈善机构和非营利组织经常使用这些类型的图形小部件。
GoFundMe是全球最大的众筹平台,每个筹款人都会获得一个温度计或进度跟踪条,随着目标的临近,温度计或进度跟踪条会填满:
GoFundMe 为女子少棒垒球队筹款的页面。页面展示了身着制服的少女们举着中央少棒垒球冠军横幅的团队照片。筹款活动已筹集到 2,450 美元,目标为 12,000 美元,以帮助该队进入少棒世界大赛。
流行的众筹平台 GoFundMe 使用进度条和温度计可视化来显示筹款活动距离完成还有多远。
动画计数器或信息图表可以帮助展示您的产品和服务的实时影响。例如,主网站有一个专门的页面来显示每分钟更新的核心平台的下载次数:
深色主题的网页显示 WordPress 6.6 的下载次数为 44,316,991。页面顶部有发布、夜间、计数器和来源的导航链接。几秒钟后,数字会增加,显示下载次数的实时更新。
的下载计数器每分钟更新一次当前运行总数。
Kinsta甚至使用统计图表来帮助您监控网站在我们不同服务中的正常运行时间:
Kinsta 状态页面的正常运行时间报告显示,Kinsta.com 主站点和联盟仪表板在 90 天内的正常运行时间为 100%。MyKinsta 仪表板的正常运行时间为 99.89%,只有几次短暂的中断(用红色和黄色条表示)。
Kinsta 的状态页面提供了一个显示任何长时间停机时间的统计图表。
这种“实时”更新策略除了炫耀和炫耀之外,还有实际用途。在某些情况下,您需要掌握某些指标的最新知识。