一、D3基础
1. D3是什么
D3（Data-Driver Documents，数据驱动文档）是基于数据来操作文档的JS库。主要用来做数据可视化的，能帮助用户使用HTML、CSS、SVG、Canvas来展示数据。D3遵循现有的Web标准无需其他任何框架而独立在现代浏览器中，它结合强大的可视化组件来驱动DOM操作。
D3可将数据绑定到DOM上，然后根据数据来计算对应DOM的属性值。D3不是一个框架，因此没有操作上的限制。
2. D3安装
D3是一个开源项目，作者是纽约时报的工程师。D3项目的代码托管于Github中。
使用npm安装
npm install d3
D3可运行在Node和Webworkers中，在Node环境中使用DOM时必须提供自己的DOM实现。推荐使用JSDOM，为避免全局document建议将DOM传递给d3.select或将NodeList传递给d3.selectAll。
var d3 = require('d3');
var jsdom = require('jsdom');
var dom = jsdom.jsdom();
d3.select(dom.body).append(''svg);
在本地开发环境中，由于浏览器的安全策略，不能直接读取本地文件。因此必须运行在一个服务器环境，推荐使用NodeJS的http-server。服务启动后当前目录中将启动一个 http://localhost:8080 的服务。
# 安装HTTP服务器
npm install -g http-server
# 后台运行HTTP Server
http-server &
二、Arrays
数组是一种常用的数据结构，JS支持原声数组操作。
JS数组自身操作
- array.pop 移除最后一个元素
- array.push 追加一个或多个元素
- array.reverse 数组翻转
- array.shift 移除首个元素
- array.sort 数组排序
- array.splice 数组添加移除元素
- array.unshift 在数组首位前添加元素
JS数组存取操作
- array.concat 数组合并
- array.join 数组元素连接
- array.slice 提取切片
- array.indexOf 查找特定元素的索引
- array.lastIndexOf 查找指定元素最后一个索引
JS数组迭代操作
- array.filter 数组过滤
- array.forEach 对元素执行方法
- array.every 是否每个元素都符合给定条件
- array.map 根据指定操作对每个元素执行后返回一个新数组
- array.some 是否存在符合某个条件的元素
- array.reduce 从左到右执行reduce操作并返回一个值
- array.reduceRight 从右向左执行reduce操作并返回一个值
D3数组操作
统计类方法(Statics)
最小值 d3.min(array[, accessor])<>
返回给定数组中的最小值，若数组为空则返回undefined。若指定accessor，则相当于在计算最小值之前调用 array.map(accessor)。与内置 Math.min 不同，d3.min忽略 undeifned, null, NaN等值。在忽略缺失数据时有用。此外，元素使用自然排序而非数值排序。
最大值 d3.max(array[, accessor])<>
返回给定数组中的最大值，若数组为空则返回 undefined。若指定accesssor则相当于在计算最小值之前调用 array.map(accessor)。
与内置Math.max不同的是，d3.min忽略undefined、null、NaN，在忽略缺失数据时有用。此外，元素使用自然排序而非数值排序。
最小值和最大值 d3.extent(array[, accessor])<>
根据指定数组返回最小值和最大值，若数组为空则返回 [undefined, undefined]。若指定accessor则相当于计算极值之前调用 array.map(accessor)。
求和 d3.sum(array[, accessor])<>
根据指定的数组计算和值，若数组为空则返回0.若指定了accessor则相当于在求和之前调用array.map(accessor)，此方法会忽略undefined和NaN。
均值 d3.mean(array[, accessor])<>
根据指定的数组返回数组的均值。若数组为空则返回undefined， 若指定accessor则相当于在计算之前调用 array.map(accessor) ，此方法会忽略 undefined 和 NaN。
中位数 d3.median(array[, accessor])<>
根据指定数组使用R-7方法返回数组中位数。若数组为空则返回 undefined。若指定 accessor 则相当于在计算之前调用 array.map(accessor)。此方法会忽略 undefined 和 NaN。
分位数 d3.quantile(array, p[, accessor])<>
根据指定的数组返回 p-分位数，p是[0,1]之间的小数。例如中位数相当于 p=0.5，使用 p=0.25 计算第一个四分位数， p=0.75 表示第三个四分位数。
var arr = [0,10,30];
d3.quantile(arr, 0); //0
d3.quantile(arr, 0.5);//10
d3.quantile(arr, 1);//30
d3.quantile(arr, 0.25);//5
d3.quantile(arr, 0.75);//20
d3.quantile(arr, 0.1);//2
方差 d3.variance(array[, accessor])<>
返回指定数组的总体方差的无偏估计(unbiased estimator of the population variance)，若数组中包含的元素小于2则返回undefinded。若指定accessor则相当于在计算之前调用了 array.map(accessor)，此方法忽略了 undefined 和 NaN。
标准差 d3.deviation(array[, accessor])<>
返回数组的标准差，若数组中包含的元素个数小于2则返回 undefined。若指定 accessor 则相当于在计算之前调用了 array.map(accessor) ，此方法忽略了 undefined 和 NaN。
查找类方法(Search)
扫描 d3.scan(array[, comparator])<>
对指定数组进行线性扫描，根据指定的比较操作返回最终元素的索引。若给定的数组不包含可比较的元素（比如比较操作返回NaN）则返回undefined，若无指定比较操作则默认 ascending。
var arr = [{foo:42}, {foo:91}];
d3.scan(arr, function(a,b){
return a.foo - b.foo;
}); //0
d3.scan(arr, function(a,b){
return b.foo - a.foo;
});//1
此方法与min类似，scan使用比较操作而非访问器，返回的是索引而非值。
d3.bisectLeft(array, x[, lo[, hi]])
