D3 vs ECharts
最近做了些数据可视化方面的项目，偶然间发现 D3 这个强大的基于 JavaScript 的可视化工具库，并惊叹其 GitHub 上的热度，竟然 远超 一度被（我自己）公认为 可视化神器 的 ECharts——
（统计时间：2020-04-04）
| GitHub 指标 | D3 | ECharts |
|---|---|---|
| Star（点赞） | 90.7k | 40.3k |
| Watch（关注） | 4k | 2k |
| Used by（被引） | 83k | 64.6k |
| Fork（叉取） | 21.9k | 13.6k |
| releases（发布） | 100 | 262 |
| contributors（贡献者） | 96 | 121 |
于是，借助前期对 JavaScript 的迷之自信与对 O'Reilly 的盲目崇拜，在网上轻轻松松找到了这本仅 70 页篇幅的资源——《Getting Started with D3》，开始了漫漫填坑之旅。。。
本书特色
这本小册子写于 2012 年，书中的 D3.js 版本为 2.8.0，所以和目前的最新版 5.15.1 在语法上还是有很多不同。书中示例均出自 MTA——纽约大都会交管局，目标读者是数据相关从业人员，包括高校研究员、统计师或设计师等喜欢撸码并乐于玩数据（不然也不会有精力去填坑）。本书主要特色大致如下：
- 跳过前期储备知识讲解（
HTML、CSS、JavaScript、SVG、canvas），直奔D3主题 - 结合纽约交通具体案例，讲解
D3基本概念 - 随书源码提供了数据清洗的完整脚本（
Python版，待填坑） - 篇幅简短，上手很快
- 挖坑无数
相关准备
1. 示例代码
当时想着只是入门，重点在了解基本概念，版本影响应该不大，结果第一次练手就卡在了 d3.json() 的新旧写法上，无奈之下只有先按老版本过一遍代码，后期再尝试更新。随书源码位置：
GitLab：https://resources.oreilly.com/examples/0636920025429.git
Gitee：https://gitee.com/PeacefulWinter2020/Getting-Started-with-D3.git
这里的 Gitee 版是为了方便大家快速同步到本地，特意从 GitLab 上迁移到 Gitee 上的。
git clone https://resources.oreilly.com/examples/0636920025429.git
git clone https://gitee.com/PeacefulWinter2020/Getting-Started-with-D3.git
2. 测试服务器
由于书中不少示例的数据源是 JSON 文件格式，需要在服务器环境下运行。书中给出的方案是 Python 版 SimpleHTTPServer。其实只要是个服务器就行，如 Tomcat。这里用到的是 VSCode 插件 Live Server 5.6.1，编辑器内直接右键【Open with Live Server】即可运行。
下面，我将从头到尾，按书中示例的顺序，逐一梳理这本小册子给大家精心准备的 D3 小确丧。。。