scale()是坐标转换函数,用法如下:
var scale = d3.scale.linear(); //<- scale是javascript函数!
.domain([100, 500]);
.range([10, 350]);
用这个函数执行的话(结果参考上图):
scale(100); //Returns 10
scale(300); //Returns 180
scale(500); //Returns 350
另外经常与scale()一起用的D3的 max(), min()函数:
var dataset = [
[5, 20], [480, 90], [250, 50], [100, 33], [330, 95],
[410, 12], [475, 44], [25, 67], [85, 21], [220, 88]
];
d3.max(dataset, function(d) { //Returns 480
return d[0]; //References first value in each sub-array
});
d3.max(dataset, function(d) { //Returns 95
return d[1]; //References second value in each sub-array
});
y轴的转化
因为在浏览器上,左上角是坐标原点,X轴向右为正,Y轴向
下为正。用D3描画一般常用数学坐标系时,需要把Y轴转向。
方法是:
把 .range([0, h]); 改写为
.range([h, 0]);