D3.js Choropleth地圖 - 在選擇時更改顏色方案

Question

我有美國各州的分類地圖，顯示使用分位數比例的總人口。我還設置了一個下拉菜單，允許用戶使用色標定義的配色方案選擇自己選擇的配色方案。在選擇時，地圖充滿了新的配色方案。

我的問題是在配色方案選擇上，形狀在配色方案中只填充一種顏色，而不是基於總體值的一系列顏色。我知道問題在於我實際上並沒有在「path」中訪問數據properties.value，我只是不知道我需要做什麼來實現這個目的，任何建議都可以讚賞，下面是我的顏色更改函數：

$('#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」 
     } 
    }) 

}); 

Answer 1

的問題是，你是更換舊的色標，不只是更新它的範圍，你永遠不設置新的比例域。

var color = d3.scale.quantile() //create new quantile scale 
    .range(colorScheme[5]); //set it's range 

如果你已經存儲在您的尺度在變量color中，只需在事件處理程序中修改它：

color.range(colorScheme[5]); //change the range