logo标签列表

学习d3.js进行数据可视化

javascriptd3.js
47

我希望开始学习制作数据可视化（作为博士期间的副业），最好使用D3.js包。我没有java经验，但我有面向对象编程的背景，因为我主要使用python工作。因此，我想知道学习使用d3的最佳方法是什么，哪种环境可以推荐给我。

6
要学习 D3.js, 可以从官方的文档和示例开始。至于 IDE，有很多选择，只需选择让您感到舒适的即可。我在开发时使用 NetBeans，在快速编辑时使用 Notepad++。P.S. Java 和 Javascript 没有任何关系。 - Adi
1
正如@Adnan所指出的，Java和Javascript不是同一种语言。 - Lee Taylor
1
请将问题转移到http://programmers.stackexchange.com/ - 虽然它与D3有关，但它并不是关于您想要解决的某个错误/功能，而是关于如何处理D3...在这种情况下，建议始终转移到http://programmers.stackexchange.com/。 - paxRoman
1
我发现这个网站非常有用。除了商业偏向和拖延之外，它是一个为新手设计的形式良好且重点突出的网站。 - Siva Tumma
2
是的，请将Java更改为JavaScript。这就像比较火腿和仓鼠一样。 - Donald Derek
显示剩余3条评论
6个回答
37
我无法让那个网站正常工作。我确定这是因为你开始的假设是要使用SVG吗？我不知道...但我花了30-45分钟还是一头雾水...我正在努力理解D3，但却摸不着头脑... - randomblink
@randomblink 很遗憾听到这个消息。你无法加载这个网站http://alignedleft.com/tutorials/d3吗？我真的鼓励你去试一试，Scott的材料非常棒。 - Gabriel Florit
Scott的网站很棒。我几乎可以理解他写的内容。但是我正在尝试创建时间轴，而且我找不到任何直接的时间轴D3教程。所有的教程都想在时间轴上使用X和Y。我想在特定事件的时间轴上放置一个点，但我找不到例子。我购买了一些教程视频、书籍等等。也许我需要暂时放下时间轴的想法，先熟悉“其他”D3概念，然后再回到时间轴...我不知道。感谢您的评论。 - randomblink
22
8

Scott Murray的网站是一个很好的起点http://alignedleft.com/tutorials/d3/。

完成这个之后，我建议你看一下这个网站http://techslides.com/over-1000-d3-js-examples-and-demos/，它列出了1000个d3的例子。通常情况下，您可以复制JavaScript数据和代码，并在自己的计算机上本地操作。

您还可以尝试使用其中一个图表并尝试重构它。

我发现这很有用的原因是您需要能够识别d3抛出的错误。那些让您毫无头绪的错误时常令人困扰。通过拥有重构的示例，您保证自己拥有一个可行的代码副本，因此您可能更容易纠正自己的错误。

3

我为初学者编写了一些教程，旨在让他们学习Javascript和数据可视化:

http://blog.vida.io/2014/06/23/coding-visualization-tutorial-1-variables/ http://blog.vida.io/2014/06/23/coding-visualization-tutorial-2-functions/

我发现维基百科的前四个教程对于学习D3基础知识非常有用:

https://github.com/mbostock/d3/wiki/Tutorials

介绍、三个小圆圈、使用连接思考、选择器的工作原理。

我的团队运行https://vida.io。我们采用模板方法来使用d3，并允许用户通过GUI编辑器快速创建工作文档、上传新数据并将数据绑定到文档中。查看示例以开始:

https://vida.io/explore

2
以下是我正在使用的学习d3js的资源列表。官方网站对于新手来说可能有些难以理解，所以这里还有一些其他的资源:
教程：
官方的D3js网站有一份好的示例和教程列表在这里。
Square公司为初学者提供了一个非常好的D3快速入门在这里。
Christophe Viau提供了一个很好的一页介绍在这里。
Jerome Cukier的"D3 Hello World"更详细地介绍了设置环境在这里。
Scott Murray（alignedleft）解释得非常好。他也是《交互式数据可视化》的作者，我强烈推荐。教程在这里。 参考资料 你将会看到很多不同的d3函数并且想知道它们的作用。可以使用官方API（这里）进行查询。
0
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接