梦入琼楼寒有月,行过石树冻无烟

D3 阈值比例尺

阈值([yù zhí],Threshold),又名临界值,可以产生一个最低值和一个最高值,通常可以运用在建筑学、生物学、飞行、化学、电信、心里、计算机等方面。通过使用阈值,我们可以将定义域内的数据完全映射到值域中。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
ar threshold = d3.scale.threshold()
.domain([10,20,30])
.range(["red","green","blue","black"])

console.log("/--------0")
console.log(threshold(-0))
console.log(threshold(-1))
console.log(threshold(-2))
console.log(threshold(-3))
console.log(threshold(-4))
console.log(threshold(-5))
console.log(threshold(-6))
console.log(threshold(-7))
console.log(threshold(-8))
console.log(threshold(-9))
console.log(threshold(-10))
console.log("/--------20")
console.log(threshold(11))
console.log(threshold(12))
console.log(threshold(13))
console.log(threshold(14))
console.log(threshold(15))
console.log(threshold(16))
console.log(threshold(17))
console.log(threshold(18))
console.log(threshold(19))
console.log(threshold(20))
console.log("/--------20")
console.log(threshold(21))
console.log(threshold(22))
console.log(threshold(23))
console.log(threshold(24))
console.log(threshold(25))
console.log(threshold(26))
console.log(threshold(27))
console.log(threshold(28))
console.log(threshold(29))
console.log(threshold(30))
console.log("/--------30")
console.log(threshold(31))
console.log(threshold(32))
console.log(threshold(33))
console.log(threshold(34))
console.log(threshold(35))
console.log(threshold(36))
console.log(threshold(37))
console.log(threshold(38))
console.log(threshold(39))
console.log("/--------40")
console.log(threshold(40))
console.log(threshold(41))
console.log(threshold(42))
console.log(threshold(43))
console.log(threshold(44))
console.log(threshold(45))
console.log(threshold(46))
console.log(threshold(47))
console.log(threshold(48))
console.log(threshold(49))
console.log(threshold(50))
console.log(threshold(100))

invertExtent

通过观察上述的 code ,我们可以发现,由于每个数据都是有一个正无穷和一个负无穷的,所以分别会将数据对应到这些值中。除此之外,我们还可以通过使用d3所提供的invertExtent过值域来分别求出定义域的数值

1
2
3
4
5
6
7
8
var threshold = d3.scale.threshold()
.domain([10,20,30])
.range(["red","green","blue","black"])

console.log(threshold.invertExtent("red"))
console.log(threshold.invertExtent("green"))
console.log(threshold.invertExtent("blue"))
console.log(threshold.invertExtent("black"))
⬅️ Go back