D3.js 如何为数据选择正确的图表

我需要使用基于JavaScript的图表库。有很多优秀的图表JS库：

D3.js

谷歌图表

ChartJS

n3图表

余烬图

流星图

海图

等等

虽然这些库提供了很多选项，但也会造成混乱，很难为数据选择正确的图表

我有以下问题：

• 根据数据选择图表有什么指导原则吗
• 您如何对数据进行分类？我从web服务获取JSON数据，数据可以是多维的。列数和行数没有限制。如果数据太大，阻止用户选择某些图表有意义吗

---

理解你的问题有两种方法，都涉及非常复杂的答案
选择正确的可视化 整本书都是关于这个话题写的。据我所知，最好的指南之一是的系列。他们为每一种更常见的图表类型（条形图、饼图或雷达图、散点图等）都写了一篇文章，每一篇都详细说明了你能在其中看到什么，它用于什么数据，以及它能隐藏什么样的信息
根据经验，如果您有大量连续数据，如时间序列，请使用。如果您的数据点很少，或者数据是离散的，那么有适合您的。如果您正在展示共享，请使用变体（尽管是堆叠的折线图，或者很难阅读）。如果呈现相关性，请使用。变化和差异最好显示在屏幕上。显示单个数据点的比率？如果您只有两个或三个相互竞争的字段，请使用a，对于更多元素，单个字段通常是更好的选择
有更多类型的图表，但除非你的读者精通统计，否则他们可能无法阅读它们。请记住，作为作者，您有责任选择正确的图表类型，这不会误导读者，并且最好地传达数据的故事。请注意，一个数据集中可能有更多的故事，因此会有更多的图形和视图
一个更普遍的建议是：不要有创造性。良好的意图（我希望我的图表看起来很酷）经常导致灾难，就像这个误导性的图表。只需坚持基本原则，不要做花哨的人造3D图表，让数据自己说话。正如Edwart Tufte所说
显示数据变化，而不仅仅是设计变化

---

选择正确的可视化库 主要因素是您的需求、任务的复杂性和编码技能。谷歌图表是一个在线Excel，你点击鼠标几次，就会得到一个像样的图表。然而，您的定制选项非常有限，如果您不喜欢输出，您将不得不寻找其他地方
另一方面，它是一种低级工具，具有相当陡峭的学习曲线。这需要一天的大部分时间才能完成。最重要的事实是，它不是一个图形库，而是一个数据驱动的文档库。是的，它确实有一些用于图形的帮助函数，但是您必须从头开始构建它们，这需要花费大量的时间和精力。您需要了解您的SVG、HTML和CSS，因为这是您将要处理的内容。奖励是它的极端灵活性，你可以基于D3制作整个应用程序。凭借技巧，它可以完全取代jQuery。它比简单的饼图生成器要复杂得多
如果你想要一个简单的饼图生成器，但是谷歌图表没有提供你需要的选项，那么像这样的真正的图形库就是为你准备的。它们以多种格式获取数据，让您选择基本的输出类型（例如饼图和条形图），进行一些定制，然后就可以开始了。这是中间立场
我不使用特定于框架的LIB，如n3、余烬或流星图，但我猜它们比D3更接近于高图表。只需检查是否只需要提供数据和配置对象，或者是否需要创建和设置单个SVGDOM节点

---

一般来说，如果不知道选择什么，从最简单的选择。试着先在Excel中创建它。然后是谷歌图表。然后学习一些JavaScript并尝试Highcharts或特定于框架的库。只有当你还需要更多的选择时，才可以选择像D3这样的大炮。
只需选择一个。这不应该有太大的区别。您可以从示例中看到图表是什么样子，每个库可以做什么，以及它是否做了您想要的事情。您可以选择Atmosphere js上最流行的图表包。这可能是一个不错的解决方案。如果你想要无限的灵活性，并且不介意做大量的编码来创建图表，那么就使用D3。如果您想要javscript最强大、最灵活的开箱即用图表解决方案，请选择Highcharts。你提到的其他选项不是我认为有效的选项。@ JLBrgs:谢谢你的回复。我的问题更多的是根据数据选择正确的图表，而不是使用哪个库。这是一个更大的开放式问题。Spotfire和Tableau等公司仍在努力解决这一问题。我发现这是一个有用的基本指南：这也是：