使用D3.js制作图表详解-创新互联

D3是用于数据可视化的Javascript库。使用SVG，Canvas和HTML。结合强大的可视化技术和数据驱动的DOM操作方法。

D3与JQuery的区别 D3是数据驱动的，JQuery不是：我们使用JQuery直接操纵元素；但是使用D3
时我们需要通过D3专有的data()，enter()和exit()方法提供数据和回调，然后D3操作元素。 D3通常用于数据可视化；JQuery用于创建Web应用。D3有很多数据可视化扩展；JQuery有很多Web应用插件。两者都是Javascript DOM操作库，提供CSS选择器和流畅的API。

What is the difference between D3 and JQuery?

最常用的方法

d3.select(selector)：选择第一个匹配selector的元素。如果没有匹配的元素，返回一个空的选择（但不是null或undefined）。

d3.selectAll(selector)：与select()不同的是，会选择所有匹配的元素。

selection.append(type)：如果指定的type是一个字符串，则将这个type（标签名称）作为新元素附加到每个选定元素的最后一个子元素。

selection.attr(name, [value])：value确定时，将selection中名为name的属性值设置成value。value可以为常量或者方法。如果value没有给出，返回selection中第一个非空元素的name属性当前值。

selection.data([data[,key]])：将数据和元素绑定起来，并返回一个新的selection。

selection.enter()：返回enter selection。此时DOM元素少于对应的数据。用于添加缺少的DOM元素。比如：

var div = d3.select("body")
  .selectAll("div")
  .data([4, 8, 15, 16, 23, 42])
  .enter().append("div")
  .text(function(d) { return d; });

另外有需要云服务器可以了解下创新互联scvps.cn，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。