我有美国各州的等值区域地图,显示使用分位数量表的总人口。我还设置了一个下拉菜单,允许用户使用colorbrewer定义的颜色方案选择他们选择的颜色方案。在选择时,地图将填充新的配色方案。
我的问题在于颜色方案选择,颜色方案中的形状只用一种颜色填充,而不是基于总体值的颜色范围。我知道问题是我实际上并没有在“路径”中访问数据properties.value。我只是不知道我需要做些什么来实现这一点。任何建议都值得赞赏。这是我的颜色更改功能:< / p>
$('#ColorSelection').change(function(){
newColor = $('#ColorSelection').val();
var colorSchemeSelect = newColor;
var colorScheme = colorbrewer[colorSchemeSelect];
var color = d3.scale.quantile()
.range(colorScheme[5]);
d3.selectAll("path").style("fill", function (d) {
var value = d.properties.value;
if (value) {
return color(value);
} else {
return "#ccc”
}
})
});
答案 0 :(得分:2)
问题在于您替换旧的色阶,而不仅仅是更新它的范围,而且您从未在新规模上设置域。
var color = d3.scale.quantile() //create new quantile scale
.range(colorScheme[5]); //set it's range
如果您将比例存储在变量color
中,只需在事件处理程序中修改它:
color.range(colorScheme[5]); //change the range