控制流程

對於進階用法，過渡提供自訂控制流程的方法。

過渡的生命週期

在建立過渡後，例如透過 selection.transition 或 transition.transition，您可以使用 transition.delay、transition.duration、transition.attr 和 transition.style 等方法來設定過渡。指定目標值的方法（例如 transition.attr）會同步評估；但是，需要內插起點值的方法，例如 transition.attrTween 和 transition.styleTween，必須延後到過渡開始時。

在建立後不久，無論是在目前畫面結束時或下一個畫面期間，過渡都會被排程。此時，延遲和 start 事件監聽器不能再被變更；嘗試這麼做會擲回訊息為「太遲了：已排程」的錯誤（或如果過渡已結束，則為「找不到過渡」）。

當轉換隨後開始時，它會中斷同一個元素上同名的活動轉換（如果有的話），並向已註冊的監聽器發送一個中斷事件。（請注意，中斷發生在開始時，而不是建立時，因此即使是零延遲轉換也不會立即中斷活動轉換：舊轉換會有一個最後的畫面。使用 selection.interrupt 立即中斷。）開始的轉換也會取消在開始轉換之前建立的同一個元素上同名的任何待處理轉換。然後，轉換會向已註冊的監聽器發送一個開始事件。這是可以修改轉換的最後時刻：轉換的時間、補間和監聽器在執行時不能更改；如果嘗試這樣做，會擲出一個錯誤訊息「太遲了：已經在執行中」（或者如果轉換已經結束，則會擲出「找不到轉換」）。轉換會在開始後立即初始化其補間。

在轉換開始的畫面中，但在所有在此畫面開始的轉換都開始之後，轉換會首次呼叫其補間。批次處理補間初始化（通常涉及從 DOM 讀取）透過避免交錯的 DOM 讀取和寫入來提升效能。

對於轉換處於活動狀態的每個畫面，它會呼叫其補間，並提供從 0 到 1 的緩和t 值。在每個畫面中，轉換會按照註冊順序呼叫其補間。

當轉換結束時，它會呼叫其補間最後一次，並提供（未緩和的）t 值 1。然後，它會向已註冊的監聽器發送一個結束事件。這是可以檢查轉換的最後時刻：結束後，轉換會從元素中刪除，並且其組態會被銷毀。（轉換的組態也會在中斷或取消時被銷毀。）在轉換被銷毀後嘗試檢查轉換會擲出一個錯誤訊息「找不到轉換」。

selection.interrupt(name)

來源 · 中斷選取元素上指定名稱的活動轉換，並取消任何具有指定名稱的待處理轉換（如果有的話）。如果未指定名稱，則使用 null。

中斷元素上的轉換不會影響任何後代元素上的任何轉換。例如，軸轉換包含軸的後代上多個獨立的、同步的轉換G 元素（刻度線、刻度標籤、網域路徑，等等）。因此，若要中斷軸轉換，您必須中斷後代

selection.selectAll("*").interrupt();

「通用選取器」，*，選取所有後代元素。如果您還想中斷 G 元素本身

selection.interrupt().selectAll("*").interrupt();

interrupt(node, name)

來源 · 中斷指定 node 上指定 name 的活動轉場，並取消任何具有指定 name 的待處理轉場（如果有）。如果未指定名稱，則使用 null。另請參閱 selection.interrupt。

transition.end()

來源 · 傳回一個承諾，當每個選取的元素完成轉場時解析。如果任何元素的轉場被取消或中斷，承諾會被拒絕。

transition.on(typenames, listener)

來源 · 為每個選取的元素新增或移除指定事件 typenames 的 listener。typenames 是下列字串事件類型之一

• start - 當轉場開始時。
• end - 當轉場結束時。
• interrupt - 當轉場中斷時。
• cancel - 當轉場取消時。

有關更多資訊，請參閱 轉場的壽命。請注意，這些 不是 selection.on 和 selection.dispatch 所實作的原生 DOM 事件，而是轉場事件！

類型可以選擇性地後跟一個句點（.）和一個名稱；選擇性的名稱允許多個回呼註冊為接收相同類型的事件，例如 start.foo 和 start.bar。若要指定多個類型名稱，請用空格分隔類型名稱，例如 interrupt end 或 start.foo start.bar。

當在選取的節點上傳送指定的轉場事件時，指定的 listener 會為轉場元素呼叫，傳遞目前的資料（d）、目前的索引（i）和目前的群組（nodes），this 為目前的 DOM 元素。Listener 始終會看到其元素的最新資料，但索引是選取的屬性，且在指定 listener 時固定；若要更新索引，請重新指定 listener。

如果先前已為選取的元素的相同 typename 註冊事件 listener，則在新增新的 listener 之前會移除舊的 listener。若要移除 listener，請將 null 傳遞為 listener。若要移除具有給定名稱的所有 listener，請將 null 傳遞為 listener，並將 .foo 傳遞為 typename，其中 foo 是名稱；若要移除沒有名稱的所有 listener，請指定 . 為 typename。

如果未指定監聽器，則傳回在第一個（非空值）所選元素上，指定事件類型名稱的目前已指派監聽器（如果有的話）。如果指定多個類型名稱，則傳回第一個符合的監聽器。

transition.each(function)

原始碼 · 對每個所選元素呼叫指定的函式，傳入目前的資料（d）、目前的索引（i）和目前的群組（nodes），其中this為目前的 DOM 元素。此方法可用於對每個所選元素呼叫任意程式碼，且對於建立同時存取父項和子項資料的內容很有用。等同於 selection.each。

transition.call(function, ...arguments)

原始碼 · 呼叫指定的函式一次，傳入此轉場以及任何選用的引數。傳回此轉場。這等同於手動呼叫函式，但有助於方法串接。例如，要在可重複使用的函式中設定多個屬性

function color(transition, fill, stroke) {
  transition
      .style("fill", fill)
      .style("stroke", stroke);
}

現在說

d3.selectAll("div").transition().call(color, "red", "blue");

這等同於

color(d3.selectAll("div").transition(), "red", "blue");

等同於 selection.call。

transition.empty()

原始碼 · 如果此轉場不包含任何（非空值）元素，則傳回 true。等同於 selection.empty。

transition.nodes()

原始碼 · 傳回此轉場中所有（非空值）元素的陣列。等同於 selection.nodes。

transition.node()

原始碼 · 傳回此轉場中的第一個（非空）元素。如果轉場為空，則傳回 null。等同於 selection.node。

transition.size()

原始碼 · 傳回此轉場中的元素總數。等同於 selection.size。