D3 中的比例尺,定义域(domain)值域(range)会是一一对应的关系.使用比例尺可以根据盒子的大小来自适应图片的大小.
var linear = d3.scale.linear()
线性比例尺
var dataset = [0,1,2,3,4,5,6,7,8,9];
var min = d3.min(dataset);
var max = d3.max(dataset);
var linear = d3.scale.linear()
.domain([min, max])
.range([0, 900]);
linear(0.9); //返回 90
linear(2.3); //返回 230
linear(3.3); //返回 330
序数比例
var index = [0, 1, 2, 3, 4];
var alpha = ["a", "b", "c", "d", "e"]
var ordinal = d3.scale.ordinal()
.domain(index)
.range(aplha);
ordinal(0); //返回 a
ordinal(2); //返回 c
ordinal(4); //返回 e
d3.scale.linear()
1.nice()告诉比例尺取得为 range() 设置的任何值域,把两端的值扩展到最接近的整数。
2.用 rangeRound() 代替 range() 后,则比例尺输出的所有值都会舍入到最接近的整数值。
3.clamp()默认情况下,线性比例尺可以返回指定范围之外的值。
var scale = d3.scale.linear()
.domain([0.123, 4.567])
.range([0, 500])
.nice();
比例尺类型
类型 | 描述 |
---|---|
linear | 线性 |
sqrt | 平方根比例尺 |
pow | 幂比例尺 |
log | 对数比例尺 |
quantize | 输出范围为独立的值的线性比例尺 |
quantile | 与 quantize 类似,但输入值域是独立的值 |
ordinal | 使用非定量值(如类名)作为输出的序数比例尺 |
d3.time.scale() | 针对日期和时间值的一个比例尺方法 |
d3.scale.category10(),d3.scale.category20(),d3.scale.category20b(),d3.scale.category20c() | 能够输出 10 到 20 种类别颜色的预设序数比例尺 |