我在D3 Library中使用3种不同的缩放分位数,量化和线性,颜色为范围。分位数和量化似乎工作得很好,在线性比例似乎不起作用。
以下是示例代码。
var measures = [1,2,3,4,5,6,7,8,9];
var colorScale = ["#f7fcfd", "#ccece6", "#66c2a4", "#238b45", "#00441b"];
var scale = d3.scale.linear().domain(measures).range(colorScale);
document.write('Linear ');
document.write(scale(1) + ',' + scale(2) + ',' + scale(3) + ',' + scale(6) + ',' + scale(7) + ',' + scale(8) + ',' + scale(9)+' ');
scale = d3.scale.quantize().domain(measures).range(colorScale);
document.write('Quantize ');
document.write(scale(1) + ',' + scale(2) + ',' + scale(3) + ',' + scale(4) + ',' + scale(5) + ',' + scale(6) + ',' + scale(7)+' ');
链接到Fiddle
在线性缩放的情况下,您可以清楚地看到9,8,7,6的值为#000。但在Quantize中,它的工作正常。
在这种情况下,请帮助我在哪里出错 希望我的问题很明确。感谢您的期待。
答案 0 :(得分:1)
如果我理解正确,线性范围是colorScale的长度,因此,这种行为是正确的。见https://github.com/d3/d3-3.x-api-reference/blob/master/Quantitative-Scales.md#linear
Given a value x in the input domain, returns the corresponding value in the output range.
。通常的解决方案是尝试类似scale(5 % colorScale.length)
希望这有帮助!