D3.js Choropleth Map - 改變選擇顏色方案

Question

我有美國各州的等值區域地圖，顯示使用分位數量表的總人口。 我還設置了一個下拉菜單，允許用戶使用colorbrewer定義的顏色方案選擇他們選擇的顏色方案。 在選擇時，地圖將填充新的配色方案。

我的問題在於顏色方案的選擇，形狀只用顏色方案中的一種顏色填充，而不是基於種群值的一系列顏色。 我知道問題是我實際上並沒有在“路徑”中訪問數據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