随笔分类 -  06.d3.js技术

摘要：上一章中使用了一个很重要的概念 — 比例尺（ scale ），本节将解说其使用方法。1. 最大值和最小值在介绍比例尺（ scale ）之前，先介绍两个经常和比例尺一起出现的函数，在【第3章】中也出现了。d3.max()d3.min()这两个函数用于求一个数组中的最大值和最小值，如果是一维数组，使用方... 阅读全文

摘要：图1. 柱形图1. 柱形图前几章的例子，都是对文字进行处理。本章中将用 D3 做一个简单的柱形图。制作柱形图有很多种方法，比如用 HTML 的 标签，或在 SVG 上绘制 。SVG ，即可缩放矢量图形（Scalable Vector Graphics），使用 XML 格式定义图形，可在 W3Sch... 阅读全文

摘要：1. select 和 selectAll 的区别在 D3 中，选择元素的函数有两个：select 和 selectAll，它们的使用非常重要。先说明一下它们的区别：select 是选择所有指定元素的第一个 selectAll 是选择指定元素的全部（用于同时操作） 这两个函数返回的结果称为选择... 阅读全文

摘要：1. 如何绑定数据D3 有一个很独特的功能：能将数据绑定到 DOM 上，也就是绑定到文档上。这么说可能不好理解，例如网页中有段落元素，我们可以将整数 5 与 绑定到一起。D3 中是通过 data() 和 datum() 函数来绑定数据的，最常用的是 data()。现有如下 HTML 代码：Hello... 阅读全文

摘要：记得以前刚上大一学 C 语言的时候，写的第一个程序就是在控制台上输出 HelloWorld 。当时很纳闷，为什么要输出这个。老师解释说所有学编程入门的第一个程序都是在屏幕上输出 HelloWorld，这是惯例。呵呵，想来真是令人怀念。好了，言归正传吧。本文的主要内容也是围绕 HelloWorld，不... 阅读全文

摘要：D3 是当前流行的数据可视化工具，通过本文能有对 D3 有一个初步认识。1. D3 是什么D3 的全称是（Data-Driven Documents），顾名思义可以知道是一个被数据驱动的文档。听名字有点抽象，说简单一点，其实就是一个 JavaScript 的函数库，使用它主要是用来做数据可视化的。... 阅读全文