d3插值示例解釋

Question

我可以確認我對以下代碼中發生的事情的理解嗎？

var color = d3.scale.linear() 
    .range(["hsl(-180,50%,50%)", "hsl(180,50%,50%)"]) 
    .interpolate(interpolateHsl); 

我們定義稱爲顏色縮放功能（不知道爲什麼我們能夠定義一個變量的函數，但我已經學會了接受這一點 - 澄清將是有益的）。

沒有指定域，因爲使用.interpolate（）只能在0和1之間的域中使用？或者因爲在這種情況下域==範圍？還是其他原因？

從插值函數調用interpolateHsl需要範圍（a和b）的開始點和結束點的'隱式參數'（無需指定 - 它們是否稱爲隱式參數或其他參考？）。

function interpolateHsl(a, b) { 
    var i = d3.interpolateString(a, b); 
    return function(t) { 
     return d3.hsl(i(t)); 
    } 
} 

現在我們定義interpolateHsl內FN插值是插值串 - 我認爲這將需要說[「宋體12px的」，「宋體24px的」]，挖出的數字部分和內插在那，然後重新加入文本元素？那麼在這種情況下，它會從hsl字符串中提取數字分量並插入這些分量？

現在（如果它還不夠），它會變得非常混亂。

t是'增量' - 所以如果總插值時間是5000ms，並且我們有5個離散的範圍，那麼t = 1000ms？所以在連續的情況下，它只是非常小？ （t）將在'時間't計算內插值，然後通過d3.hsl（）將其轉換爲真正的hsl值而不僅僅是一個字符串表示。

爲什麼這必須在函數內的函數中？要訪問t？大致說來，我的理解是不完整的，所以對於發生什麼事情的更廣泛的解釋會非常有幫助。

Answer 1

1. 在Javascript中，您可以同時使用var和function申報功能（參見例如this question） - 功能是語言的一等公民，可以被傳遞，就像變量。

2. 沒有指定域，因爲在這裏缺省值（[0,1]）就足夠了。沒有其他原因，特別是它不受範圍或內插器設置的影響。

3. interpolate()以工廠爲參數（參見the documentation）。也就是說，它需要一個函數，而不是一個值（這與第1點有關 - 函數可以像變量一樣傳遞）。這些功能的參數由規模的實施提供，對用戶透明。您一般都在告訴比例尺如何插值，而不是如何插值特定值。當內插時間到來時，標度將知道用適當的參數調用該函數。

4. 是的，interpolateHsl()會插入字符串中的數字 - 我再次指您the documentation。

5. t什麼告訴插值函數轉換已經進行了多長時間，即開始和結束之間的位置。它是0到1之間的數字，其中0表示「轉換尚未開始」和1「轉換結束」。這也在the documentation中描述。

6. 插值函數返回一個函數，給定t告訴它轉換已經進行了多久，返回當前值。這稱爲關閉 - 一個匿名（未命名）函數，捕獲它引用的變量的綁定。特別是，該閉包捕獲了兩個字符串a和b之間的插值。也就是說，當調用interpolateHsl()（通過內部比例）時，會給出兩個目標字符串進行插值。它是而不是給出了t的值。它返回 a 函數需要一個t值，並返回兩個字符串（在閉包中捕獲的i內的「活」）之間的插值的適當位置。現在轉換已經建立並開始。它會生成t的值，並將其傳遞給先前創建的插值函數。

This page有關於關閉的簡要教程，您可能會發現有幫助。