摘要：
柱形图是一种最简单的可视化图标，主要有矩形、文字标签、坐标轴组成。 本文为简单起见，只绘制矩形的部分，用以讲解如何使用 D3 在 SVG 画布中绘图。 一、 画布是什么 前几章的处理对象都是 HTML 的文字，没有涉及图形的制作。 要绘图，首要需要的是一块绘图的“画布”。 HTML 5 提供两种强有 阅读全文
摘要：
在上一节中，已经讲解了 select 和 selectAll，以及选择集的概念。本节具体讲解这两个函数的用法。 假设在 body 中有三个段落元素： 现在，要分别完成以下四种选择元素的任务。 一、选择第一个 p 元素 使用 select ，参数传入 p 即可，如此返回的是第一个 p 元素。 结果如下 阅读全文
摘要：
插入元素涉及的函数有两个： 一、append()：在选择集末尾插入元素 假设有三个段落元素 在 body 的末尾添加一个 p 元素，结果为： 二、insert()：在选择集前面插入元素 在 body 中 id 为 myid 的元素前添加一个段落元素。 已经指定了 Pear 段落的 id 为 myid 阅读全文
摘要：
选择元素和绑定数据是 D3 最基础的内容，本文将对其进行一个简单的介绍。 一、如何选择元素 在 D3 中，用于选择元素的函数有两个： d3.select()：是选择所有指定元素的第一个 d3.selectAll()：是选择指定元素的全部 d3.select()：是选择所有指定元素的第一个 d3.se 阅读全文
摘要：
一、HTML 是怎么输出 HelloWorld 的 会在浏览器中输出两行文字，如下图： 二、用 JavaScript 来更改 HelloWorld 对于上面输出的内容，如果想用 JavaScript 来更改这两行文字，怎么办呢？我们会添加代码变为： 结果变为： 三、用 D3 来更改 HelloWor 阅读全文
摘要：
一、What´s D3.js D3.js是一种数据操作类型的javascript库（也可视其为插件）；结合HTML,SVG和CSS，D3可以图形化的，生动的展现数据。 D3 的全称是（Data-Driven Documents），顾名思义可以知道是一个被数据驱动的文档。就是一个 JavaScript 阅读全文