作者都是各自领域经过审查的专家,并撰写他们有经验的主题. 我们所有的内容都经过同行评审,并由同一领域的Toptal专家验证.
卡梅伦·查普曼的头像

Cameron Chapman

Cameron是Uxcel的前内容主管, 她是UX设计课程的教学设计师, skill assessments, 等教育设计内容. 她在设计教育领域拥有超过20年的经验, 为Toptal的设计博客撰稿, Smashing Magazine, Web Designer News, CodeVisually, and Webdesigner Depot.

Share

使用大量数据并不总是那么简单. Sometimes, 数据集是如此之大,以至于完全不可能从中辨别出任何有用的东西. 这就是数据可视化的用武之地.

创建数据可视化 很少是直截了当的. 这并不是说设计师可以简单地获取包含数千个条目的数据集,然后从头开始创建可视化. Sure, it’s possible, 但谁愿意花几十个或几百个小时在散点图上画点呢? 这就是数据可视化工具的用武之地.

什么是数据可视化工具?

数据可视化工具提供 数据可视化设计者 用一种更简单的方法来创建大型数据集的可视化表示. 当处理包含数十万或数百万个数据点的数据集时, 自动化创建可视化的过程, at least in part, 让设计师的工作变得更加轻松.

这些数据可视化可以用于各种目的: dashboards, annual reports, 销售及市场推广资料, investor slide decks, 几乎任何其他地方的信息都需要立即解释.

最好的数据可视化工具有什么共同之处?

The best data visualization tools 市场上有几个共同点. 首先是它们的易用性. 有一些非常复杂的应用程序可以用于可视化数据. 有些游戏拥有优秀的文档和教程,并以用户感觉直观的方式设计. 其他国家在这些方面有所欠缺, 将它们从“最佳”工具列表中删除, 不管他们的其他能力如何.

最好的工具也可以处理大量的数据. 事实上,最好的甚至可以在一个可视化中处理多组数据.

最好的工具还可以输出一系列不同的图表、图形和地图类型. 下面的大多数工具都可以输出图像和交互式图表. 但是,对于各种输出标准也有例外. 一些数据可视化工具专注于特定类型的图表或地图,并且做得很好. 这些工具在“最佳”工具中也占有一席之地.

最后,还有成本方面的考虑. 虽然更高的价格标签并不一定会使工具失去资格, 从更好的支持来看,更高的价格是合理的, better features, and better overall value.

数据可视化示例
这个数据可视化显示了50个国家的人权保护指数(1950年至2014年)和侵犯人权指数(2014年). (by Federica Fragapane)

数据可视化工具比较

There are dozens, if not hundreds, of applications, tools, 以及可用于创建大型数据集可视化的脚本. 许多是非常基本的,并且有很多重叠的特征.

但是有一些突出的工具,它们可以创建更多类型的可视化功能,或者比其他选项更容易使用.

Tableau(和Tableau Public)

Tableau 是否有多种选择, including a desktop app, 服务器和托管在线版本, and a free public option. 有数百种数据导入选项可用, 从CSV文件到Google Ads和Analytics数据再到Salesforce数据.

输出选项包括多种图表格式以及映射功能. 这意味着设计师可以创建彩色编码的地图,以一种比表格或图表更容易理解的格式展示地理上重要的数据.

The public Tableau的版本是免费的,任何人都可以使用一个强大的方式来创建数据可视化,可以在各种设置中使用. 从记者到政治迷,再到那些只想量化自己生活数据的人, Tableau Public有很多潜在的用途. 他们有一个广泛的信息图表和可视化画廊,这些都是与公共版本一起创建的,可以为那些有兴趣创建自己的人提供灵感.

Pros

  • 数百个数据导入选项
  • Mapping capability
  • 免费公开版本
  • 很多视频教程教你如何使用Tableau

Cons

  • 非免费版本很贵(Tableau Creator软件的价格为70美元/月)
  • 公共版本不允许您保持数据分析的私密性

数据可视化示例

数据可视化工具可用于各种项目

数据可视化示例-缅因州驼鹿撞车事件

数据可视化工具可以很容易地创建交互式可视化.

Bottom Line

对于那些需要创建地图和其他类型图表的人来说,Tableau是一个很好的选择. 对于任何想要创建面向公众的可视化的人来说,Tableau Public也是一个很好的选择.

Infogram

Infogram 是一个功能齐全的拖放可视化工具,甚至允许非设计人员创建有效的营销报告数据可视化, infographics, social media 帖子、地图、仪表板等等.

完成的可视化可以导出为多种格式: .PNG, .JPG, .GIF, .PDF, and .HTML. 交互式可视化也是可能的,非常适合嵌入到网站或应用程序中. Infogram还提供了一个WordPress插件,可以让WordPress用户更容易地嵌入可视化.

Pros

  • 分层定价,包括基本功能的免费计划
  • 包括35+图表类型和550+地图类型
  • Drag and drop editor
  • 用于导入其他数据源的API

Cons

  • 内置数据源明显少于其他一些应用程序

Examples

数据可视化方法

数据可视化框架

数据可视化技术-映射

Bottom Line

Infogram对于非设计人员和设计人员都是一个很好的选择. 拖放编辑器可以轻松创建专业外观的设计,而无需大量的视觉设计技巧.

ChartBlocks

ChartBlocks 声称可以使用他们的API从“任何地方”导入数据,包括从实时提要. 虽然他们说从任何来源导入数据都可以在“几次点击”中完成,“它肯定比其他应用程序更复杂,这些应用程序有针对特定数据源的自动化模块或扩展.

该应用程序允许对最终创建的可视化进行广泛的定制, 图表构建向导帮助用户在导入数据之前为图表选择正确的数据.

设计师几乎可以创建任何类型的图表,并且输出是响应性的——这是一个很大的优势 数据可视化设计者 谁想要将图表嵌入到可能在各种设备上查看的网站中.

Pros

  • 免费和价格合理的付费计划是可用的
  • 易于使用的向导导入必要的数据

Cons

  • 不清楚他们的API有多健壮
  • 似乎没有任何映射功能

Examples

信息可视化工具使创建图表更容易

数据可视化的基础:简单的图表可能是最有效的.

数据可视化最佳实践-折线图

Bottom Line

ChartBlocks拥有出色的免费计划,这是一大优势. 创建基本图表和图形的易用性也很出色.

Datawrapper

Datawrapper 是专门为在新闻报道中添加图表和地图而创建的吗. 创建的图表和地图是交互式的,可以嵌入新闻网站. 他们的数据来源是有限的, though, 主要方法是将数据复制并粘贴到工具中.

导入数据后,只需单击一下就可以创建图表. 它们的可视化类型包括列, line, and bar charts, election donuts, area charts, scatter plots, Choropleth和符号映射, and locator maps, among others. 完成的可视化让人想起那些在《欧博体育app下载》或《欧博体育app下载》等网站上看到的. 事实上,他们的图表被《欧博体育app下载》、《欧博体育app下载》和《欧博体育app下载》等出版物使用.

这个免费计划非常适合在流量有限的小型网站上嵌入图形, 但是付费计划是昂贵的, starting at $39/month.

Pros

  • 专为新闻编辑室数据可视化设计
  • 免费计划适合较小的站点
  • 工具包括一个内置的色盲检查器

Cons

  • Limited data sources
  • 付费计划是昂贵的

Example

Alt文本:良好的数据可视化-包括数据的多种表示

Bottom Line

Datawrapper是新闻站点数据可视化的绝佳选择. Despite the price tag, Datawrapper为特定于新闻的可视化所包含的特性使它物有所值.

D3.js

D3.js 是一个使用数据操作文档的JavaScript库吗. D3.js至少需要一些js知识, 尽管有些应用程序允许非编程用户使用该库.

Those apps include NVD3,为D3提供可重用的图表.js; Plotly’s Chart Studio, which also allows designers to create WebGL and other charts; and Ember Charts,它也使用烬.js framework.

Pros

  • 非常强大和可定制
  • 大量的图表类型可能
  • A focus on web standards
  • 可以让非程序员创建可视化的工具
  • Free and open source

Cons

  • 需要编程知识单独使用
  • 与付费工具相比,可用的支持更少

Examples

数据可视化的例子-弦图

数据可视化示例- Choropleth地图

数据可视化示例- voronoi地图

Bottom Line

D3.Js只适合那些可以向程序员寻求帮助的设计师, 或者自己有编程知识.

Google Charts

谷歌图表是一个强大的工具, 免费的数据可视化工具,专门用于创建用于嵌入在线的交互式图表. 它处理动态数据,输出完全基于HTML5和SVG, 因此,它们可以在浏览器中工作,而无需使用额外的插件. 数据来源包括Google Spreadsheets, Google Fusion Tables, Salesforce,以及其他SQL数据库.

有各种各样的图表类型, including maps, scatter charts, column and bar charts, histograms, area charts, pie charts, treemaps, timelines, gauges, and many others. 这些图表可以完全定制,通过简单的CSS编辑.

Pros

  • Free
  • 各种各样的图表格式可用
  • 跨浏览器兼容,因为它使用HTML5/SVG
  • Works with dynamic data

Cons

  • 除了可用的教程和论坛之外,支持也很有限

Examples

数据可视化工具-谷歌图表

数据可视化方法-地理图

数据可视化最佳实践——注释

Bottom Line

如果设计师对编码比较熟悉,并且想要一个功能强大的应用程序,那么Google Charts是一个不错的选择, free solution. 能够使用任何SQL数据库作为数据源,这也使它成为大型数据集的一个很好的选择.

FusionCharts

FusionCharts 是另一个基于javascript的选项,用于创建web和 mobile dashboards. 它包括150多种图表类型和1000多种地图类型. 它可以与流行的JS框架(包括React)集成, jQuery, React, Ember, 和Angular)以及服务器端编程语言(包括PHP), Java, Django, and Ruby on Rails).

FusionCharts为所有图表和地图变体提供了现成的代码, 使其更容易嵌入到网站,甚至为那些设计师有限的编程知识. 因为FusionCharts的目标是 creating dashboards 它不是简单的数据可视化,而是本文中最昂贵的选项之一. 但它也是最强大的力量之一.

Pros

  • 大量的图表和地图格式选项
  • 比大多数其他可视化工具更多功能
  • 与许多不同的框架和编程语言集成

Cons

  • 昂贵(一个开发者许可证的起价接近500美元)
  • 对于仪表板环境之外的简单可视化来说,这是多余的

Examples

数据可视化仪表板

仪表板是并排显示多个数据可视化的简单方法

数据可视化仪表板非常适合用于业务操作.

Bottom Line

在创建仪表板方面,本文中没有其他内容可以与FusionCharts相提并论. 如果这就是手头的项目,这无疑是最强大的选择.

Chart.js

Chart.js 是一个简单但灵活的JavaScript图表库. It’s open source, 提供多种图表类型(总共8种), 并允许动画和互动.

Chart.js使用HTML5 Canvas作为输出,因此它可以在所有现代浏览器中很好地呈现图表. 创建的图表也是响应式的, 所以它对于创建移动友好的可视化非常有用.

Pros

  • Free and open source
  • 响应式和跨浏览器兼容的输出

Cons

  • 与其他工具相比,图表类型非常有限
  • 官方文档之外的有限支持

Examples

数据可视化技术-交互式气泡图

数据可视化技术-多轴折线图

数据可视化方法:堆叠面积折线图

Bottom Line

Chart.对于需要一个简单的、可定制的、交互式可视化选项的设计师来说,Js是一个很好的选择. 它最大的卖点是免费和开源.

Grafana

Grafana 开源可视化软件允许用户创建动态仪表板和其他可视化吗. 它支持混合数据源, annotations, 以及可定制的警报功能, 它可以通过数百个可用的插件进行扩展. 这使得它成为最强大的可视化工具之一.

导出功能允许设计人员共享仪表板的快照,并邀请其他用户进行协作. Grafana支持超过50个数据源 plugins. 它可以免费下载,也可以提供每月49美元的云托管版本. (还有一个非常有限的免费托管版本.)下载版本也有可用的支持计划, 这是很多其他开源工具无法提供的.

Pros

  • 开源,提供免费和付费选项
  • 可供选择的大量数据源
  • 各种图表类型可用
  • 使创建动态仪表板变得简单
  • 可以使用混合数据源吗

Cons

  • 对于创建简单的可视化来说,这是过度的
  • 不提供像其他工具那样多的可视化定制选项
  • 不是创建可视化图像的最佳选择
  • 无法在网站中嵌入仪表板,但可以用于单个面板

Examples

数据可视化仪表板

数据可视化仪表板

数据可视化仪表板

Bottom Line

Grafana是创建仪表板的最佳选择之一 用于内部使用,特别是用于混合或大型数据源.

Chartist.js

Chartist.js is a free, 它允许创建简单的响应式图表,这些图表是高度可定制的,并且跨浏览器兼容. gzip压缩后,整个JavaScript库只有10KB. 图表创建与图表.Js也可以动画化,并且插件允许扩展它.

Pros

  • Free and open source
  • Tiny file size
  • Charts can be animated

Cons

  • 不是最广泛的图表类型选择
  • No mapping capabilities
  • 开发人员社区之外的有限支持

Examples

数据可视化基础:复杂并不总是更好.

Bottom Line

Chartist.对于想要简洁的设计师来说,Js是一个不错的选择, embeddable, 响应图表与一个小的文件大小.

Sigmajs

Sigmajs 是用于创建网络图的单一用途的可视化工具吗. 它是高度可定制的,但需要一些基本的JavaScript知识才能使用. 创建的图形是可嵌入的、交互式的和响应式的.

Pros

  • 高度可定制和可扩展
  • Free and open source
  • 易于在网站和应用程序中嵌入图形

Cons

  • 只创建一种类型的可视化:网络图
  • 需要JS知识来定制和实现

Examples

数据可视化方法-网络图

Bottom Line

因为它的关注点单一, Sigmajs是创建网络图的一个很好的选择,只要设计者熟悉JavaScript.

Polymaps

Polymaps 是一个专门用于映射的JavaScript库. The outputs are dynamic, 各种风格的响应式地图, 从图像叠加到符号映射到密度映射. 它使用SVG来创建图像,因此设计师可以使用CSS来定制地图的视觉效果.

Pros

  • Free and open source
  • 专为映射而构建
  • 易于在网站和应用程序中嵌入地图

Cons

  • 只创建一种类型的可视化
  • 需要一些编码知识来定制和实现

Examples

Good data visualization

信息可视化工具- polymaps

Bottom Line

如果地图是唯一需要的可视化类型,那么Polymaps是一个不错的选择, 只要设计师熟悉一些基本的编码.

Conclusion

有如此多的可视化工具可供设计师使用,以至于很难决定使用哪一个. 数据可视化设计者 是否应该牢记诸如易用性和工具是否具有他们需要的功能之类的事情.

选择最强大的工具并不总是最好的主意:学习曲线可能是陡峭的, 需要更多的资源来启动和运行, 而一个更简单的工具可能能够在很短的时间内创建所需的东西. Remember, though, that the tool is only part of the equation in creating a data visualization; designers also need to consider what else goes into making a great data visualization.

大多数数据可视化工具包括免费试用(如果整个工具不是免费的), 因此,在决定选择一个解决方案之前,花点时间尝试几个解决方案是值得的.

Understanding the basics

  • 最好的数据可视化工具是什么?

    最好的数据可视化工具包括Google Charts, Tableau, Grafana, Chartist.. js、FusionCharts、Datawrapper、Infogram、ChartBlocks和D3.js. 最好的工具提供各种可视化样式, are easy to use, 并且可以处理大型数据集.

  • 什么是数据可视化工具?

    数据可视化工具为设计人员提供了一种更简单的方法来创建大型数据集的可视化表示. 当处理包含数十万或数百万个数据点的数据集时, 创建可视化过程的自动化大大简化了设计师的工作.

  • 什么是数据可视化技术?

    数据可视化技术包括图表(线), bar, or pie), 图(气泡或散点), diagrams, maps (heat maps, geographic maps, etc.), and matrices. 设计人员可以使用这些特定技术的许多变体来满足基于他们正在处理的数据的特定可视化需求.

  • 我们为什么要使用数据可视化?

    除非采用某种可视化方法,否则几乎不可能从具有数百万个数据点的大型数据集中识别信息, 例如基本图形或交互式仪表板.

  • 数据可视化有多重要?

    没有数据可视化,从大型数据集中得出结论几乎是不可能的. 数据可视化方法使利益相关者能够理解信息.

就这一主题咨询作者或专家.
Schedule a call

世界级的文章,每周发一次.

订阅意味着同意我们的 privacy policy

世界级的文章,每周发一次.

订阅意味着同意我们的 privacy policy

Toptal Designers

Join the Toptal® community.