我在刚接触使用d3.js的时候，最感到困惑的一个地方是data(), enter(), exit()这几个操作。 在我接触一段时间，有了一些了解之后，简单说说我的理解。 data() 先看一个例子： 执行代码： d3.select("body ...

从今天开始我将和大家一起学习D3.js（Data-Driven Documents），由于国内关于D3的学习资料少之又少，所以我觉得很有必要把自己学习过程记录下来，供同学们参考，如果文章有有哪些表达有错误的还希望同学们帮我指出来。当然了， 可以的话我希望大家都可以去看看英文资料（文章后面将列英文 ...

上一节我们已经学习了线条样式和格栅的绘制，在这一节中我们将要根据之前绘制的线条对图表进行填充，首先来看一下我们的目标吧 在这个图表中，我们对位于线条下面的空间进行了填充，那么，如何改做到呢？ ...

上节我们学习了如何绘制多条曲线， 以及给不同的曲线指定不同的坐标系。在这节当中，我们会对坐标轴标签相关的处理进行学习。首先，我们来想一个问题， 如何我们的x轴上的各个标签的距离比较近，但是标签名又比较 ...

上一节中我们学会了如何旋转x轴标签以及自定义标签内容，在这一节中，我们将接触动画（transition） 首先，我们要在页面上添加一个按钮，当我们点击这个按钮时，调用我们的动画。所以，我们还需要在原 ...

D3.js 是操作基于数据文件的JavaScript库。它使用HTML、SVG和CSS让你的数据基情四射。D3在web标准上着重为你提供现代浏览器的全部功能，而且不需要通过使用你自己专门的框架、结合强大的可视化组件和DOM操作的数据驱动方法。 点击下载最新版（3.5.5）： d ...

上一节我们已经学习了如何设置填充区域，其实理解了他的实现原理还是非常简单了。这一节中， 我们主要学习多条曲线的绘制，以及给不同的曲线指定不同的纵坐标。 新的数据 由于我们要画两条曲线，所以我 ...

上一节中我们已经画出了一个基本的图表，不过忘了给坐标轴添加标签了，所以在本节中我们要给坐标轴加上标签，目标效果如下 给X轴添加标签 很明显，标签是不是一个text内容块啊，所以我们只要在svg ...