68 lines
2.5 KiB
Markdown
68 lines
2.5 KiB
Markdown
---
|
||
title: D3
|
||
localeTitle: D3
|
||
---
|
||
# D3:数据驱动文档
|
||
|
||
**数据驱动文档** (D3.js)是一个JavaScript库,用于在Web浏览器中生成动态,交互式数据可视化。 **D3.js** API包含各种方法,可以分为以下逻辑单元 - _选择_ , _转换_ , _数组_ , _数学_ , _颜色_ , _比例_ , _SVG_ , _时间_ , _布局_ , _地理_ , _几何_ , _行为_ 。
|
||
|
||
![D3.js标志](https://i2.wp.com/pbiswas101.files.wordpress.com/2018/07/d3.jpg?w=312&h=161)
|
||
|
||
**D3.js**通过将强大的可视化和交互技术与数据驱动的DOM操作方法相结合,帮助您可视化数据。它还通过为您的数据设计正确的可视界面,提供现代浏览器的全部功能。
|
||
|
||
**D3.js**版本1.0.0于2011年2月18日发布。
|
||
|
||
## 为什么,D3.js?
|
||
|
||
_D3_ \*没有引入新的视觉表现。与**Processing** , **Raphaël**或**Protovis不同** , _D3的_图形标记词汇直接来自Web标准:HTML,SVG和CSS - https://d3js.org/
|
||
|
||
###### 入门
|
||
|
||
你可以从中学到超过20,000多个**D3.js的**例子,但是你永远不知道任何给定的例子会多么平易近人!所以,问题是 - 如何从第一原理构建可视化?正如您可能已经看到的那样,D3的API非常庞大,所以我们可以提前了解一些在早期特别有用的实用工具:
|
||
|
||
* **D3级**
|
||
|
||
![](https://i0.wp.com/pbiswas101.files.wordpress.com/2018/07/scale.png?w=400&h=100)
|
||
|
||
* **D3型**
|
||
|
||
![](https://i0.wp.com/pbiswas101.files.wordpress.com/2018/07/shape.png?w=400&h=100)
|
||
|
||
* **D3选择**
|
||
|
||
![](https://i0.wp.com/pbiswas101.files.wordpress.com/2018/07/selection.gif?w=400&h=100)
|
||
|
||
* **D3收集**
|
||
|
||
![](https://i0.wp.com/pbiswas101.files.wordpress.com/2018/07/collection.png?w=400&h=100)
|
||
|
||
* **D3-层次**
|
||
|
||
![](https://i2.wp.com/pbiswas101.files.wordpress.com/2018/07/hierarchy.png?w=400&h=100)
|
||
|
||
* **D3变焦**
|
||
|
||
![](https://i1.wp.com/pbiswas101.files.wordpress.com/2018/07/zoom.gif?w=400&h=100)
|
||
|
||
* **D3力**
|
||
|
||
![](https://i1.wp.com/pbiswas101.files.wordpress.com/2018/07/force.gif?w=400&h=100)
|
||
|
||
因此,只需要了解一些最新HTML5功能的基本知识,例如SVG,Canvas,您就可以深入了解像**D3.js**这样的库将数据变为现实的世界! ######贡献
|
||
|
||
* https://github.com/d3/
|
||
|
||
### 资源
|
||
|
||
* https://en.wikipedia.org/wiki/D3.js
|
||
|
||
* https://en.wikipedia.org/wiki/Document _对象_模型
|
||
|
||
* http://blockbuilder.org/search
|
||
|
||
* https://d3indepth.com/
|
||
|
||
* https://davidwalsh.name/learning-d3
|
||
|
||
|
||
* * * |