動態變化rateById.set在chloropeth地圖

Question

我試圖用jqueryslider修改邁克·博斯托克的chloropeth地圖，而不是

queue() 
    .defer(d3.json, "/mbostock/raw/4090846/us.json") 
    .defer(d3.tsv, "unemployment.tsv", function(d) { rateById.set(d.id, +d.rate); }) 
    .await(ready); 

我

function refresh(p) { 
     queue() 
      .defer(d3.json, "us.json") 
      .defer(d3.csv, "unemployment2.csv", function (d,p) { 
       rateById.set(d.id, +p);  
      }) 
      .await(ready); 
     console.log(p); 
    } 

我在滑塊捕捉值下面

$(function() { 
     $("#slider").slider({ 
      value: 100, 
      min: 2000, 
      max: 2013, 
      step: 1, 
      slide: function (event, ui) { 
       $("#year").val(ui.value); 
       refresh("+d.rate" + ui.value); 
      } 
     }); 
     $("#year").val($("#slider").slider("value")); 

    }); 

代碼當我寫p來控制檯它出來作爲d.rate2013，d.rate2012，等c。如我所願，但值不會進入rateById.set。我還得到了一張chloropeth地圖，當我前進滑塊時，這些線條逐漸消失。

Answer 1

您在函數聲明再次它，即陰影p應該

.defer(d3.csv, "unemployment2.csv", function (d) { 
    rateById.set(d.id, +p);  
}) 

你也想在列，而不是JavaScript代碼的名稱通過。也就是說，做

refresh("rate" + ui.value); 

然後

.defer(d3.csv, "unemployment2.csv", function (d) { 
    rateById.set(d.id, +d[p]);  
}) 

在一般筆記，沒有必要每次將滑塊移動時重新加載數據，你只需要遍歷數據，並設置rateById到適當的價值。