計時

轉場的 緩衝、延遲 和 持續時間 是可設定的。例如，可使用逐元素延遲來 交錯重新排列 元素，以改善感知。有關建議，請參閱 統計資料圖形中的動畫轉場。

transition.delay(value)

來源 · 對每個選取的元素，將轉場延遲設定為指定的 value（毫秒）。

transition.delay(250);

value 可以指定為常數或函式。如果是函式，則會針對每個選取的元素立即依序評估，傳遞目前的資料（d）、目前的索引（i）和目前的群組（nodes），其中 this 為目前的 DOM 元素。函式的傳回值會用來設定每個元素的轉場延遲。如果未指定延遲，則預設為零。

如果未指定 value，則傳回轉場中第一個（非空值）元素的延遲目前值。這通常只有在您知道轉場只包含一個元素時才會有用。

transition.delay() // 250

將延遲設定為索引 i 的倍數，是對一組元素交錯過渡的便捷方式。例如

transition.delay((d, i) => i * 10);

當然，您也可以將延遲計算為資料的函數，或在計算基於索引的延遲之前，對選擇進行排序。

transition.duration(value)

來源 · 對於每個選取的元素，將過渡持續時間設定為指定的 value（以毫秒為單位）。

transition.duration(750);

value 可以指定為常數或函數。如果是函數，則會立即針對每個選取的元素依序評估，傳遞目前的資料 (d)、目前的索引 (i) 和目前的群組 (nodes)，並將 this 作為目前的 DOM 元素。然後使用函數的回傳值來設定每個元素的過渡持續時間。如果未指定持續時間，則預設為 250 毫秒。

如果未指定 value，則回傳過渡中第一個（非空值）元素的持續時間目前值。這通常只有在您知道過渡只包含一個元素時才有用。

transition.duration() // 750

transition.ease(value)

來源 · 指定所有選取元素的過渡 緩動函數。

transition.ease(d3.easeCubic);

value 必須指定為函數。緩動函數會針對動畫的每個畫面呼叫，傳遞範圍 [0, 1] 內的正規化時間 t；然後它必須回傳緩動時間 tʹ，通常也在範圍 [0, 1] 內。一個好的緩動函數如果 t = 0 時應該回傳 0，如果 t = 1 時應該回傳 1。如果未指定緩動函數，則預設為 easeCubic。

如果未指定 value，則回傳過渡中第一個（非空值）元素的目前緩動函數。這通常只有在您知道過渡只包含一個元素時才有用。

transition.ease() // d3.easeCubic

transition.easeVarying(factory)

範例 · 原始碼 · 指定轉場的工廠 緩動函數。

transition.easeVarying((d) => d3.easePolyIn.exponent(d.exponent));

工廠 必須是函數。它會在選擇的每個節點中呼叫，傳遞目前的資料 (d)、目前的索引 (i) 和目前的群組 (nodes)，其中 this 為目前的 DOM 元素。它必須傳回緩動函數。