安利一些不错的D3.js数据可视化资源

注：本文有点长，可以点赞收藏后慢慢看。另外有本文未涉及的、大家觉得不错的D3.js资源教程也欢迎评论进行分享。

前言

从「年更博主冒个泡，或将开启可视化之旅 - 牛衣古柳 - 2020.08.27」一文至今，已经过去整整10个月，期间古柳实践过一些demo、复现过一些作品、写过一些(没人看的)文章、也一点点将可视化交流群“运营”到了大概550多人。

其实群里蛮早就有人问 D3.js 如何学习、求 D3.js 教程、问有啥推荐书籍等，虽然没统计过，但目测十多次看到这些问题还是有的，古柳也推荐过很多次自己觉得不错的资源，论理应该写篇文章整理分享下，这样以后再有人问起，直接分享文章就行，就不用每次重复在群里贴那些资源链接，而且还无法解释太多。但一直没动手，一拖就到了现在。

虽然过去那么久，但接触过并想推荐的还是以下几个资源，毕竟最核心搞懂 D3.js 到底是如何进行可视化的，掌握了流程、步骤、原理，再去看其他例子或作品源码，就好上手多了，也不至于被网上各种风格、不同实现流程的代码带偏。

古柳也知道很多人的背景都不太一样，有懂技术的有不懂技术的、有会前端的有不会前端的、有更偏向中文资源有中英都能接受的...接下来推荐的资源不一定能让对 D3.js 可视化感兴趣的每个人都觉得有用，但确实觉得还不错，就姑且先整理出来，大家有其他补充的优质资源也欢迎评论留言或群里分享。

基础部分

首先，D3.js 毕竟是一个 JavaScript 库，也是前端里的一部分，所以必要的 HTML、CSS、JS 等基础先过一遍，对后续学习 D3.js 会有极大帮助，而且都2021年了，最好顺带学下 ES6，箭头函数、模板字符串之类用起来也简洁些，毕竟很多例子里也都那么写的，不至于看到犯懵。当然如果不是一上来就奔着专业前端去的，可以先不用学得太深，像 JS 里数组、对象、函数、循环、条件判断、async await这些基本掌握就差不多了，可以进入下一步 SVG 和 D3.js 的学习。

这里推荐古柳去年学的B站 后盾人教程，首先 HTML、CSS、JS 都有系列视频，依次学习即可。较之其他很多视频里废话连篇、内容冗长，古柳比较喜欢向军大叔每一课时都简短干练，让人能较轻松坚持下去，同时整个体系又很完整全面。

当然需要重复一句，JS 部分可能前几章(比如到第4章数组即可)看完就暂时够用了，如果是新手，想先体验 D3.js 可视化的，后面大部分章节其实可以先放放，以免在这里扎太深、折腾太久、越学越头秃，然后放弃了。

D3.js 部分

打完基础，就可以开始看 D3.js，其实网上相关资源并不少，中文的也都有些，只不过网上很多例子是不同时间写的，可能用的 D3.js v3/v4/v5 等不同版本，API 略有变化，导致不明真相的新手直接照着实现可能出现报错。

虽然古柳觉得 v4 以后应该就没那么大差异，但大家还是多留意下