d3函数库scale详解的使用

d3官网 https://www.d3js.org.cn/document/d3-force/ 

先导入函数库 

import * as d3 from "d3-scale";

在前端领域有可能会遇到，要将数值或数组转化为坐标或位置，或颜色等；D3scale提供了这种方便转化的函数； 

先熟悉几个函数

domain是定义域，就是坐标系下的值
range是值域，就是映射到svg画布上的值

1.d3.scaleLinear() 线性比例尺，最适合将数据转化为位置和长度
domain：域
range：值范围

返回相应的值范围

scaleNum = d3.scaleLinear().domain([1,10]).range([0,100])

 scaleNum(1)=0

var x = d3.scaleLinear().domain([10, 130]).range([0, 960]);
x(-10); // -160, outside range

x.invert(-160); // -10, outside domain

 If clamping is enabled, the return value of the scale is always within the scale’s range

x.clamp(true);

x(-10); // 0, clamped to range

x.invert(-160); // 10, clamped to domain

此链式调用最终会返回一个函数,scaleNum(num)，意思为将定义域[1,10]映射到值域[0,100]中，会平分一一对应关系对数值num进行映射处理；

求一组数组中的最大值、最小值；

• d3.max( arr,func)
• d3.min()

func函数可以用来求二维数组,对数组的每一项进行处理然后return，例如 

function(d){
    return d[0]; 
}