轉換之後更改對象屬性D3

Question

我想在轉換完成後爲對象提供屬性。我簡單地更新的圖像位置如下：

tmp.transition().duration(1000) 
        .attr("transform", function(d) {return 'translate(' + 
        coordinates[d].x +',' + 
        coordinates[d].y + ')'}) 

一旦完成，我想給對象TMP屬性「感動」，其值爲「無」。我試過了：

tmp.transition().duration(1000) 
    .attr("transform", function(d) {return 'translate(' + 
      coordinates[d].x +',' + 
      coordinates[d].y + ')'}).end('moved', 'no') 

但是沒有成功。有小費嗎？謝謝，

Answer 1

據the documentation，您可以使用.each：

tmp.transition().duration(1000) 
.attr("transform", function(d) {return 'translate(' + 
     coordinates[d].x +',' + 
     coordinates[d].y + ')'} 
).each('end', function() { 
    d3.select(this).attr('moved', 'no'); 
    // or maybe also this.setAttribute('moved', 'no'); 
}); 

Answer 2

你可以告訴javascript等待一段時間後使用window.setTimeout運行代碼。你只需要使用相同的毫秒數來同步兩個事件。

window.setTimeout(function(){ 
    //Your fake "callback" code here 
}, 1000); 

Answer 3

在迴應@ user1066286（因爲我不能發表評論）：你不應該（）在這裏使用setTimout！公寓從它是不好的做法，你不能保證當超時停止時實際上將完成轉換。

從D3轉換文檔：

轉變有一個四階段的生命週期：

的過渡計劃。 轉換開始。 轉換運行。 轉換結束。

這四個phazes的是異步處理，所以沒有辦法知道的過渡多久實際上需要。它可能會比用戶定義的持續時間慢一點，但可能會更快一些。