D3：延遲後添加元素，然後轉換

Question

我有一個非常大的csv文件，可以用D3.js進行可視化。其中一個數據字段是一個時間戳，因此（而不是一次顯示所有這些信息）我想在與時間戳成比例的延遲之後創建一個svg元素（基於其他數據字段），然後將它淡出三個秒。由於數據的大小，即使它們不可見，我也無法預先創建所有元素;每個元素應該只存在三秒鐘。期望的效果是一堆點出現然後消失。

我的最佳嘗試如下。策略是使用兩個轉換：一個延遲，然後是淡入淡出轉換。它似乎並不奏效，而是一次創造出所有的元素（儘管如此，衰落也是如此）。既然問這個問題

d3.csv(datafile).get(function(error, rows) { 
     for (var i = rows.length; i--;){ 
       var d = rows[i]; 
       plot.select("foo") // empty selection 
        .transition() 
        .delay(/*expression with d.timestamp*/) 
        .call(function(){ 
         plot.append("circle") 
          .attr(/*several, snip */) 
          .style("opacity", 1) 
          .transition() 
          .duration(3000) 
          .style("opacity", 0) 
          .remove() 
        }); 
     } 

    }); 

編輯2015年4月已經學到了很多東西，很明顯的一點似乎是與0不透明立即插入一切。然後創建一個持續時間0，可變延遲轉換以捕捉到1不透明度，然後從那裏淡出。也可以使用嵌套選擇來避免顯式的for循環。我還沒有嘗試過，但它應該工作。

Answer 1

您是否嘗試過使用setTimeout？

 rows.forEach(function(d, i){ 
      setTimeout(function(){ 
        plot.append("circle") 
         .attr(/*several, snip */) 
         .style("opacity", 1) 
         .transition() 
         .duration(3000) 
         .style("opacity", 0) 
         .remove() 
      }, /*expression with d.timestamp*/); 
     })