绝对疯狂地试图解决这个问题,应该在学校里更加努力学习!
我想要实现一些我认为很容易做到的事情,但很难理解它的术语。
我想根据2种设置中的1种选择来创建热图。
首先,如果我有5个国家,例如:
我正在根据排名尝试着色。例如,如果我有红色,黄色,绿色,蓝色和紫色,那么以下情况就是如此:
UK = Red,USA = Yellow,Brazil = Green,Germany = Blue,China = Purple。
其次,我想在值上着色它们,所以在这种情况下应用以下内容:
UK = Red,USA = Green,Brazil = Greeny Blue,Germany = Bluey Purple,China = Purple。
但是我绝对不知道这是一个线性的,有序的,分位数的还是你有什么!
我已阅读说明,看起来Domain是输入,Range是输出。
我有以下代码:
var colours = ['#FF0000', '#FFFF00', '#00FF00', '#0000FF', '#FF00FF'];
var heatmapColour = d3.scale.linear().domain([0, sortedArray.length]).range(colours);
在那个例子中,对于'排名',我希望每个heatMapColour返回红色,黄色,绿色,蓝色和紫色,但我得到5种颜色,从红色(第一个位置)到黄色(最后一个位置)。 / p>
任何指针?
修改
作为一个例子,这“几乎可以正常运作”。
var colours = ['#FF0000', '#FFFF00', '#00FF00', '#0000FF', '#FF00FF'];
var heatmapColour = d3.scale.quantize().domain([0, sortedArray.length-1]).range(colours);
如果我的数组有5个项目,它会为每个项目生成一种颜色的结果,但如果我的数组中有10个项目,我有2个红色,2个黄色,2个绿色等,而不是红色,红色 - > ;橙色,橙色 - >黄色等。
同样,如果我在阵列中有3个项目,我会得到红色,绿色,紫色,然后什么也没有。没有意义!
答案 0 :(得分:1)
为此我喜欢使用RainbowVis.js [https://github.com/anomal/RainbowVis-JS]将数值映射到颜色:
类似的东西:
var rainbow = new Rainbow();
rainbow.setSpectrum('green', 'red');
rainbow.setNumberRange(minValue, maxCalue);
return rainbow.colourAt(CountryValue);
您可以为渐变添加更多颜色
答案 1 :(得分:1)
仍然不确定我理解,但听起来你想要一个分位数比例:
var x = d3.scale.quantile()
.domain([0,500,1000,4000,5000,10000])
.range(["#FF00FF", "#0000FF", "#00FF00", "#FFFF00", "#FF0000"]);
> x(400)
"#FF00FF"
> x(600)
"#0000FF"
> x(10001)
"#FF0000"