转载请注明本仓库地址
最新版文档逐步完善中, 之前版本请参考 这里
D3 (或者叫 D3.js )是一个基于 web 标准的 JavaScript 可视化库. D3 可以借助 SVG, Canvas 以及 HTML 将你的数据生动的展现出来. D3 结合了强大的可视化交互技术以及数据驱动 DOM 的技术结合起来, 让你可以借助于现代浏览器的强大功能自由的对数据进行可视化.
如果本文档对您有帮助,请打赏以示鼓励!
- 移除 d3-request ; 添加 d3-fetch
- 移除 d3-queue ; 推荐使用 Promise.all
- 添加 d3-scale-chromatic
- 添加 d3-contour
- 添加 selection.clone
- 添加 d3.create
- 移除
d3.schemeCategory20*
颜色方案 - 修复不同版本的D3模块的重复安装问题(#3256)
- Fix d3.format’s SI format for locales with currency suffixes.
D3现在包含新的基于 ColorBrewer的 category color schemes(类别颜色方案).ColorBrewer配色方案拥有卓越的 divering(发散) 和 sequential(连续)颜色方案. 移除 d3.schemeCategory20*
是因为其设计经常被错误的用来暗示不存在的关系: 颜色相近的常被误以为是一组, 而亮度不同则常被误以为是排序.
5.0.0 可以通过 npm install d3@next
来体验
如果使用 npm
, 则可以通过 npm install d3
来安装. 此外还可以下载 最新版, 最新版支持 AMD、CommonJS 以及基础标签引入形式. 你也可以直接从 d3js.org, CDNJS, 或者 unpkg 加载. 比如:
<script src="https://d3js.org/d3.v4.js"></script>
压缩版:
<script src="https://d3js.org/d3.v4.min.js"></script>
你也可以单独使用 d3
中的某个模块, 比如单独使用 d3-selection:
<script src="https://d3js.org/d3-selection.v1.min.js"></script>
如果要使用某个固定的版本, 则考虑 CNDJS 或 unpkg
D3基于 ES2015 modules 开发. 可以使用 Roolup, webpack 或者其他你偏爱的打包工具进行构建. 在一个符合 ES2015 的应用中导入 d3
或者 d3
的某些模块:
import {scaleLinear} from "d3-scale";
或者导入 d3
的全部功能并且设置命名空间 (这里是 d3
):
import * as d3 from "d3";
在 Nodejs 环境中:
var d3 = require("d3");
你也可以导入多个模块然后将这些模块集合到 d3
对象中, 此时使用 Object.assign:
var d3 = Object.assign({}, require("d3-format"), require("d3-geo"), require("d3-geo-projection"));